如何处理发送到AngularJS控制器的对象?

时间:2017-06-14 14:41:08

标签: javascript angularjs

在我的控制器中,我有一个从Java控制器接收对象的函数。我的AngularJS变量很简单:

var self = this;
self.item = {};

我得到对象的函数:

  function getItem() {
        MyService.getItem(REST_SERVICE_URI)
            .then(
                function (d) {
                    self.item = d;                        
                },
                function (errResponse) {
                    console.error('Error while getting item');
                }
            );
   }

收到的对象结构相当复杂。它具有id,name和子对象列表,它们还具有id和name字段。如何进入AngularJS控制器中此对象的字段和列表?我尝试使用下面的fucntion循环列表甚至计算重复值,但它不起作用。我甚至试图在控制台输出结果中包含一个循环,没有效果。它只返回零。

       var i = "SOME TEST NAME VALUE TO CHECK";

       function getCount(i) {        
            var iCount = iCount || 0;        
            for (var el in self.item) {
                console.log("let me see what are you: " + el);
                if (el == i) {
                    iCount++;
                }
            }        
            return iCount;
        }

我收到的对象没问题,我可以使用F12 - 网络 - 响应或预览在Chrome中查看内容。

后来添加: 在我的页面上,我像这样测试它

<tr class="my_item" ng-repeat="p in ctrl.item.children">
 <span>getCount {{p.name}}: {{ctrl.getCount(p.name)}}</span>
</tr>

它在span btw中显示p.name。 Java对象结构是

public class Item {    
    private int id;    
    private String name;
    List<Child> children = new ArrayList<>();
}

儿童课很简单

public class Child {    
        private int id;    
        private String name;        
    }

1 个答案:

答案 0 :(得分:1)

根据您的问题,内容很复杂且递归 properties inside child content

因此,您需要在一个recursively内迭代内容forEach loop

查看此示例工作演示

var myApp = angular.module('myApp', []);
myApp.controller('ExampleController', function() {
var vm = this;
  vm.count = 0;
  vm.searchTxt = "";
  vm.getCount = function() {
    vm.count = 0; //clear count before search
    recursive(vm.content);
  }


  function recursive(dataArray) { //recursive function
    dataArray.forEach(function(data) {
      if (vm.searchTxt == data.name) { //match name property
        vm.count = vm.count + 1;
      }
      if (data.child.length > 0) {
        recursive(data.child); // call recursive function
      }
    });
  }

  vm.content = [{ //example content
    id: 1,
    name: 'one',
    child: [{
      id: 1.1,
      name: 'new one',
      child: [{
        id: 1,
        name: 'one',
        child: []
      }]
    }]
  }, {
    id: 2,
    name: 'two',
    child: [{
      id: 1.1,
      name: 'new two',
      child: []
    }]
  }]

});
<script src="https://code.angularjs.org/1.5.2/angular.js"></script>

<div ng-app="myApp" ng-controller="ExampleController as vm">
  <input ng-model="vm.searchTxt" placeholder="ender search.." />
  <br>
  <button ng-click="vm.getCount()">Search</button>
  <br>
  <span>Match 'Name' count : {{vm.count}}</span>
</div>