简体   繁体   English

如何使用$ scope绑定值以在状态ui-router中定义的控制器中使用ng-model查看?

[英]How to bind value with $scope to view with ng-model from controller that define in state ui-router?

I used mechanism for transferring state ui-router. 我使用了转移状态ui路由器的机制。 With state "inputcontract" that I have defined, when processed ( http://cem.survey.local/#/inputcontract/SGD621262 ), it will pass parameter "sohd" to function "$scope.getSurveyContent($scope,sohd)" in controller "accountController" , this function will send the request to the server to retrieve data returns in json structures. 使用我定义的状态“ inputcontract”,在处理后( http://cem.survey.local/#/inputcontract/SGD621262 ),它将把参数“ sohd”传递给函数“ $ scope.getSurveyContent($ scope,sohd)”在控制器“ accountController”中,此函数会将请求发送到服务器以检索json结构中的数据返回。 The problem is that I cannot bind value to view by using $scope with json return "$scope.account =response.data_cusinfo[0]", if bind successfully it will appear dynamic on view HTML. 问题是我无法通过将$ scope与json返回“ $ scope.account = response.data_cusinfo [0]”结合使用来绑定值以查看,如果绑定成功,它将在视图HTML上显示为动态。 How can i do that? 我怎样才能做到这一点? Thank you very much. 非常感谢你。

Here is app.js 这是app.js

var app = angular.module('outbound', ['ngMaterial', 'ui.router'])
    .constant('API_URL', 'http://cem.survey.local/');
app.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
        .state('inputcontract', {
            url: "/inputcontract/:sohd",
           controller: 'accountController'
        })
})

Here is accountController.js 这是accountController.js

app.controller('accountController', function ($scope, $http,$templateRequest, $sce, $compile, $mdDialog, $mdSidenav, $mdMedia, API_URL, $stateParams) {
if (typeof $stateParams.sohd === 'undefined') {
return;
}
$scope.account = {};
var sohd=$stateParams.sohd;
$scope.getSurveyContent= function($scope,sohd)
{   var url = API_URL + "account/search";    
    $http({
        method: 'POST',
        url: url,
        data: {sohd: sohd},
        headers: {'Content-Type': 'application/json'}
    }).success(function (response) {
      $scope.account =response.data_cusinfo[0];
    }).error(function (response) {

    });
}
 //Send Request to server with sohd
 $scope.getSurveyContent($scope,sohd);

Here is the view 这是视图

<html lang="en-US" ng-app="outbound">
...
<div  ng-controller="accountController">
...
<td style="width: 150px">Khách hàng
   <div class="form-group">
   <input class="form-control" id="inputdefault" type="text"
    ng-model="account.CustomerName"  >
   </div></td>
      <td>CMND
       <div class="form-group">
      <input class="form-control" id="inputdefault" type="text"
      ng-model="account.Passport" >
    </div>
     </td>
       <td>Ngày tháng năm sinh
     <div class="form-group">
   <input class="form-control" id="inputdefault" type="text"
     ng-model="account.Birthday">
      </div></td>
...
</div>
...
</html> 

Assuming the $http post is successful, you don't need to pass $scope on your getSurveyContent function. 假设$http发布成功,则无需在getSurveyContent函数上传递$scope Also, success and error are deprecated - you should use then . 此外,不建议使用successerror -您应该使用then Try this: 尝试这个:

$scope.getSurveyContent = function(sohd) {   
    var url = API_URL + "account/search";    
    $http({
        method: 'POST',
        url: url,
        data: {sohd: sohd},
        headers: {'Content-Type': 'application/json'}
    }).then(
        function successCallback (response) {
            $scope.account = response.data.data_cusinfo[0];
        }, 
        function errorCallback (response) {
        }
    );
}

//Send Request to server with sohd
$scope.getSurveyContent(sohd);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM