如何访问数组内的属性并将它们推送到列表 Angularjs

Question

我正在开发一个 angularJS 应用程序，我正在其中访问服务并获取 JSON 数据，如下所示。

    {  
       "repositoryFileDto":[  
          {   "aclNode":"false",
             "createdDate":"1433166794593",
             "fileSize":"16208",
             "folder":"false",
             "hidden":"false",
             "id":"d4850a7e-17f7-4ee6-a3c5-125c26077da8",
             "lastModifiedDate":"1433166794593",
             "locale":"en",
             "localePropertiesMapEntries":[  ],
             "locked":"false",
             "name":"accountInfo.prpt",
             "ownerType":"-1",
             "path":"/home/admin/accountInfo.prpt",
             "title":"accountInfo",
             "versionId":"1.0",
             "versioned":"true" },
          {  },
          {  }, 
          {  }
       ]

}

从上面的数组中，我需要获取每个对象的名称属性并将它们推送到列表中。

这是我的代码，但它说 undefined 不是一个函数。

 $scope.filteredDashboards = [];
 $scope.ExistingreportDetails = [];
 $scope.GetReportDetails = function() {
            $http({
                method: 'GET',
                url: 'http://192.168.1.201/api/repo/files/%3Ahome%3Aadmin/children?showHidden=false&filter=*',
                // cache: $templateCache,
                headers: {
                    'Access-Control-Allow-Origin': '*',
                    'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
                    'Access-Control-Allow-Headers': 'Content-Type, X-Requested-With',
                    'Authorization': 'Basic YWRtaW46cGFzc3dvcmQ='
                }
            }).
            success(function(data, status) {
                $scope.ExistingreportDetails = angular.toJson(data);
                $scope.filteredDashboards =$scope.ExistingreportDetails[0].repositoryFileDto ;
                console.log($scope.ExistingreportDetails);
                 $scope.filteredDashboards.forEach(function(entry) {
                 console.log(entry);
                 });
             $scope.ExistingreportDetails = $scope.ExistingreportDetails["1"].widgets;
    //alert("success");

            }).
            error(function(data, status) {
                alert("Request failed");
            });
        };

我需要这样的输出，

$scope.reports = 
 [
    {
        name: "AODdetails",
        title: "#f00"
    },
    {
        name: "AccountInfo",
        title: "#0f0"
    }
]

Answer 1

repositoryFileDto是一个数组，所以：

$scope.filteredDashboards =$scope.ExistingreportDetails[0].repositoryFileDto[0] ;

编辑：

$scope.filteredDashboards = $scope.ExistingreportDetails.repositoryFileDto[0];

创建新数组：

var newArray = $scope.filteredDashboards.map(function(el, id, arr){
      return //What you want;
   });

Answer 2

因为 $scope.ExistingreportDetails 是一个对象，试试这个：

$scope.filteredDashboards = $scope.ExistingreportDetails.repositoryFileDto[0];

Answer 3

您在哪一行收到错误？

您可以使用 Angular 的 ForEach 函数来推送对象或数组。 https://docs.angularjs.org/api/ng/function/angular.forEach

  angular.forEach(data.repositoryFileDto[0], function(value) {
    this.push(value);
  }, $scope.ExistingreportDetails);

您已经 return 来自 HTTP 请求的 json 对象，因此没有必要在此处转换为 json 对象：

$scope.ExistingreportDetails = angular.toJson(data);

所以如果你想输出 "aclNode" 的值，你可以简单地做

console.log(data.repositoryFileDto[0].aclNode);

或者如果您将数据结果分配给 $scope.ExistingreportDetails :

console.log($scope.ExistingreportDetails.repositoryFileDto[0].aclNode);

Answer 4

我猜你需要这样使用 angular.forEach() 方法:

试试这个：

success(function(data, status) {
    $scope.ExistingreportDetails = angular.toJson(data);

    console.log($scope.ExistingreportDetails);

    angular.forEach($scope.ExistingreportDetails, function(entry, i) {
         $scope.filteredDashboards.push(entry.name); // push the name from the object
    });

    $scope.ExistingreportDetails = $scope.ExistingreportDetails["1"].widgets;
    //alert("success");
})

Answer 5

查看此代码，单击按钮时将调用保存功能，并将值存储在报告数组中。

<doctype html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body ng-app="myApp" data-ng-controller="HomeCtrl">


 <button ng-click="save()">Save</button>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

 <script>
   var app = angular.module('myApp',[]);

app.controller('HomeCtrl', function($scope){

    $scope.data= {  
                 "repositoryFileDto":[  
                    {   "aclNode":"false",
                       "createdDate":"1433166794593",
                       "fileSize":"16208",
                       "folder":"false",
                       "hidden":"false",
                       "id":"d4850a7e-17f7-4ee6-a3c5-125c26077da8",
                       "lastModifiedDate":"1433166794593",
                       "locale":"en",
                       "localePropertiesMapEntries":[  ],
                       "locked":"false",
                       "name":"accountInfo.prpt",
                       "ownerType":"-1",
                       "path":"/home/admin/accountInfo.prpt",
                       "title":"accountInfo",
                       "versionId":"1.0",
                       "versioned":"true" },
                    {  "aclNode":"false",
                       "createdDate":"1433166794593",
                       "fileSize":"16208",
                       "folder":"false",
                       "hidden":"false",
                       "id":"d4850a7e-17f7-4ee6-a3c5-125c26077da8",
                       "lastModifiedDate":"1433166794593",
                       "locale":"en",
                       "localePropertiesMapEntries":[  ],
                       "locked":"false",
                       "name":"accountInfo1.prpt",
                       "ownerType":"-1",
                       "path":"/home/admin/accountInfo.prpt",
                       "title":"accountInfo",
                       "versionId":"1.0",
                       "versioned":"true"},
                    {  "aclNode":"false",
                       "createdDate":"1433166794593",
                       "fileSize":"16208",
                       "folder":"false",
                       "hidden":"false",
                       "id":"d4850a7e-17f7-4ee6-a3c5-125c26077da8",
                       "lastModifiedDate":"1433166794593",
                       "locale":"en",
                       "localePropertiesMapEntries":[  ],
                       "locked":"false",
                       "name":"accountInfo2.prpt",
                       "ownerType":"-1",
                       "path":"/home/admin/accountInfo.prpt",
                       "title":"accountInfo",
                       "versionId":"1.0",
                       "versioned":"true"}, 
                    { "aclNode":"false",
                       "createdDate":"1433166794593",
                       "fileSize":"16208",
                       "folder":"false",
                       "hidden":"false",
                       "id":"d4850a7e-17f7-4ee6-a3c5-125c26077da8",
                       "lastModifiedDate":"1433166794593",
                       "locale":"en",
                       "localePropertiesMapEntries":[  ],
                       "locked":"false",
                       "name":"accountInfo3.prpt",
                       "ownerType":"-1",
                       "path":"/home/admin/accountInfo.prpt",
                       "title":"accountInfo",
                       "versionId":"1.0",
                       "versioned":"true" }
                 ]

              };

              $scope.reports=[];

              $scope.save=function()
              {
                for(var i=0; i<$scope.data.repositoryFileDto.length; i++)
                   {
                      var obj1={};
                      obj1.name=$scope.data.repositoryFileDto[i].name;
                      obj1.title=$scope.data.repositoryFileDto[i].title;
                      $scope.reports.push(obj1);
                   } 

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


});
</script>
</body>

</html>

如何访问数组内的属性并将它们推送到列表 Angularjs

How to access properties inside an array and push them to a List Angularjs

json

controller

http

angularjs