AngularJS:ng-repeat不起作用

时间:2015-11-07 13:38:34

标签: angularjs model-view-controller asp.net-web-api2 single-page-application

我目前正在使用angularjs和MVC Web Api开发SPA应用程序。我试图通过从SQL Server中获取数据来填充网格,然后将其绑定到数据表然后传递:

{ 
  "countryID":null,
  "countryCode":null,
  "countryName":null,
  "currencyCode":null,
  "currencyName":null,
  "currencyDecimals":null,
  "timeZone":null,
  "countries":[],
  "returnStatus":true,
  "returnMessage":["success"],
  "validationErrors":{},
  "totalPages":0,
  "totalRows":0
  "isAuthenicated":false,
  "sortExpression":0,
  "sortDirection":3,
  "currentPageNumber":0,
  "totalPageCount":0,
  "dtMain": [
    {"countryID":1},
    {"countryID":2},
    {"countryID":3},
    {"countryID":4},
    {"countryID":5},
    {"countryID":7} ]
}

我可以访问所有其他属性,但不能访问 dtMain 。我的HTML如下:

<pre>
  <div class="section-box" ng-controller="countryGridController as vm" 
    ng-init="vm.initializeController()"> 
      {{vm.sortDirection}}
      <div data-ng-repeat="obj in vm.dtMain">
          {{obj.countryID}}
      </div>
  </div>
</pre>

1 个答案:

答案 0 :(得分:0)

$ scope变量用于绑定视图和它的控制器,所以无论你想从控制器引用什么对象,都要将它分配给控制器函数中$ scope的成员

    function countryGridController(){
        $scope.vm= { 
            "countryID":null,
            "countryCode":null,
            "countryName":null,
            "currencyCode":null,
            //and so on
        };
    }

并在视图中

 <pre>
  <div class="section-box" ng-controller="countryGridController"> 
      {{vm.sortDirection}}
      <div data-ng-repeat="obj in vm.dtMain">
          {{obj.countryID}}
      </div>
  </div>
</pre>