Question

我正在尝试在angularjs项目中迭代来自Web服务的数据。我遇到的问题是：

在我的控制台日志中，它会显示每个项目的信息，但是一旦我尝试在我的html上显示它，它只显示数据的最后一项？

HTML

<ion-item ng-repeat="item in documents">{{item}}</ion-item>

如果我将 id 添加到这样的项目中：

<ion-item ng-repeat="item in documents">{{item.id}}</ion-item>

它只显示与数据量相同的空格。我认为数据存在，但没有显示任何字符串值。

JS

.controller('DashCtrl', function($scope, $http) {
    $http.get("http://localhost:15021/Service1.svc/getAllTrucks")
            .success(function(data) {

                var obj = data;
                var ar = [];

                angular.forEach(obj, function(index, element) {

                    angular.forEach(index, function(indexN, elementN) {
                        ar = {id: indexN.QuoteID, quotenum: indexN.QuoteNumber};

                        console.log(ar);
                    });

                    $scope.documents = ar;

                });

                console.log(data);
            })
            .error(function(data) {
                console.log("failure");
            });

我想要完成的是使用数据列表填充应用程序。谢谢。（如果事情没有任何意义，请询问）

Answer 1

您实际上并没有将每条记录添加到数组中，而只是将迭代项目分配给数组。结果，你唯一看到的就是最后一条记录。您可以添加.push()以将每个迭代记录添加到数组的末尾。

 var ar = [];

 angular.forEach(obj, function(index, element) {
     angular.forEach(index, function(indexN, elementN) {
         ar.push({id: indexN.QuoteID, quotenum: indexN.QuoteNumber});
     });
 });

 $scope.documents = ar;

此外，您应该在嵌套迭代结束时指定ar。

Answer 2

你可以尝试一下：

.success(function(data) {
    var obj = data;
    $scope.documents  = [];

    angular.forEach(obj, function(index, element) {

        angular.forEach(index, function(indexN, elementN) {
            $scope.documents.push( {id: indexN.QuoteID, quotenum: indexN.QuoteNumber});

            console.log($scope.documents);
        });

    });

    console.log(data);
})

Angularjs使用forEach

2 个答案: