Question

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

这是我的HTML正文内容，只要 $ http.get（）<＆＃39; mydata＆＃39; （JSON数组）就会正确显示/ strong>方法接收请求的数据，但 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; }); });

Answer 1

您将控制器混合为语法和使用范围。在http://plnkr.co/qpcKJZx4jovC6YdzBd6J查看我的plunker，你会看到一个例子。

主要的变化是当使用控制器作为语法时，您需要将变量绑定到此。

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

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

选择一种发布视图数据的方法，并坚持使用它，无论是控制器还是$ scope。

你会注意到来自服务器＆＃34;的顶级＆＃34;数据。不再使用plunker，因为我没有更改那个以使用控制器作为语法。

将$ http.get（）请求中的数据绑定到ng-repeat中

1 个答案: