Angularjs 无法在视图中反映$http响应

我看到了与此相关的其他问题，并尽我所知实施了答案。但是，我无法使用ng repeat在视图中显示响应。这是我的密码

JS文件：

app.controller('testcontrol', ['$scope', '$http', function($scope, $http) {
    $scope.resultset = [];
    $http.get('http://localhost:3000/testdata').then(function(data) {
      $scope.resultset = data.data.resultset;
      console.log($scope.resultset);
      },function(error) {
        $scope.error = error;
      })
}]);

<div class="wrapper-md" ng-controller="testcontrol">
    <ul>
        <li data-ng-repeat="result in resultset">
            {{result.name}}
        </li>
    </ul>
</div>

[Object, Object, Object, Object, Object]
0: Object
avatar: "img/a4.jpg"
followers: "2104"
name: "Chris Fox"
title: "Master Chef"
url: "#"
__proto__: Object
1: Object
2: Object
3: Object
4: Object
length: 5
__proto__: Array[0]

HTML:

app.controller('testcontrol', ['$scope', '$http', function($scope, $http) {
    $scope.resultset = [];
    $http.get('http://localhost:3000/testdata').then(function(data) {
      $scope.resultset = data.data.resultset;
      console.log($scope.resultset);
      },function(error) {
        $scope.error = error;
      })
}]);

<div class="wrapper-md" ng-controller="testcontrol">
    <ul>
        <li data-ng-repeat="result in resultset">
            {{result.name}}
        </li>
    </ul>
</div>

[Object, Object, Object, Object, Object]
0: Object
avatar: "img/a4.jpg"
followers: "2104"
name: "Chris Fox"
title: "Master Chef"
url: "#"
__proto__: Object
1: Object
2: Object
3: Object
4: Object
length: 5
__proto__: Array[0]

---

这是由于范围问题。在Angular中，不能直接交换对象或数组

要使其工作，请使用：

app.controller（'testcontrol'，['$scope'，'$http'，函数（$scope，$http）{
$scope.resultset=[]；
$http
.get（'http://localhost:3000/testdata')
.then（功能（数据）{
copy（data.data.resultset，$scope.resultset）；//此处
log（$scope.resultset）；
}，函数（错误）{
$scope.error=错误；
});
}]);

更新

---

我终于找到了。这有点冗长，但被认为是理解AngularJS 1.x的必要条件。我建议从头到尾阅读本文档：）

在范围功能或私人功能中使用您的分配或操作。因此，这将帮助您仅在需要时调用该方法，并且可以重用相同的方法

注意：确保您正在获取数组结果中的数据

app.controller('testcontrol', ['$scope', '$http', function($scope, $http) {
    $scope.resultset = [];
    $scope.GetData =function(){
       $http.get('http://localhost:3000/testdata').then(function(data) {
          $scope.resultset = data.data.resultset;
          console.log($scope.resultset);
      },function(error) {
        $scope.error = error;
      })
    }

    $scope.init=function(){
        $scope.GetData();
    }
}]);

HTML:

{{result.name}

您得到的数据结构可能与预期的不同。用控制台日志更新您的问题，无论您得到什么。我期望得到的数据结构是一个数组。这不是数据结构的问题。无论如何，我正在用控制台响应更新问题。我认为在赋值后使用$scope.$apply（）可以解决问题no。不是这样。正如我所提到的，控制台响应与预期的一样。所以，数组赋值没有问题。@Aravind您的数据是正确的。问题是您不能直接将数组分配给

$scope.resultset

，因为它将更改该数组的引用。在这种情况下，您需要使用

angular.copy

，以保留其引用。（我还在挖掘文档…）我已经尝试过你的解决方案。不过，视图中没有任何内容。@Aravind，它在这里工作。嘿，谢谢你的帮助。它正在工作，这是一个范围问题，而不是代码问题。您的plunker帮助我解决了问题。

ngInit

不应以这种方式使用。请参阅其中的警告“我同意@ParkSoonWai，但它无论如何都不起作用”。@ParkSoonWai如果不使用init，我可以调用该方法。因此它可以调用getData并获取数据。但有时脚本会被加载两次。因此，将发生两次不必要的呼叫。我看到了他们的评论。我们是否需要将ng init仅用于ng repeat作为别名属性？？@JeevaJsb技术上

ngInit

很适合进行初始化调用。问题是控制器逻辑现在位于模板中。“模板初始化控制器”的想法听起来并不正确。通过控制器自身初始化，逻辑流感觉更好。此外，在测试方面，

ngInit

使控制器更难测试。最终，您将为控制器测试创建模拟模板，而这些测试一开始是不必要的。