从 $http.get() 请求中绑定数据到 ng-repeat

Question

从 $http.get() 请求中绑定数据到 ng-repeat

angularjsangularjs-ng-repeatangular-http

10

我能够从服务器获取到我的JSON数据，但是当我尝试使用ng-repeat指令在页面上列出它时出现了问题。

这里是我的HTML正文内容，'mydata'（JSON数组）在$http.get()方法接收到请求的数据后正确显示，但ng-repeat未列出数组元素：

<body ng-app="myapp">
  <div ng-controller="MyController" >
    Data from server: {{ mydata }}          
  </div>

  <hr>

  <ul ng-controller="MyController as controller">
    <li ng-repeat="data in controller.mydata">
      {{ data }}
    </li>
 </ul>
</body>

以下是JavaScript代码：

var URI = 'http://my_service_uri/';

angular.module("myapp", [])
    .controller("MyController", function($scope, $http) {
        $scope.mydata = [];

        $http.get(URI)
            .then(function(result) {
                $scope.mydata = result.data;
             });
    });

- charliebrownie

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- rtucker88 · Accepted Answer

你把控制器和作用域搞混了。请查看我在http://plnkr.co/qpcKJZx4jovC6YdzBd6J上的示例。

最主要的变化是，在使用控制器的语法时，需要将变量绑定到“this”。

app.controller('MyController', function($http) {
    var vm = this;
    vm.mydata = [];

    $http.get(URI)
        .then(function(result) {
          console.log(result);
          vm.mydata = result.data;
         });

选择一种发布视图数据的方法，并坚持使用它，可以是controller as或$scope。

你会注意到在plunker中，“来自服务器的数据”不再起作用了，因为我没有将其更改为使用controller as语法。