lọc: mảng notarray dự kiến ​​nhưng không nhận được: 0

Question

khiển

@RequestMapping(value = "/graphs", method = RequestMethod.GET, produces = MediaType.APPLICATION_JSON_VALUE) 
    public Collection<Graph> getSkeletonGraph() 
    { 
     log.debug("REST request to get current graphs"); 
     return graphService.getSkeletonGraphs(); 
    } 

góc gọi

$scope.graphs = []; 
    Graph.getGraphs().$promise.then(function(result) 
    { 
     $scope.graphs = result; 
    }); 



    angular.module('sampleApplicationApp').factory('Graph', function($resource) 
    { 
     return { 
     getGraphs: function() { 
      return $resource('api/graphs/:id').query(); 
     } 
    }; 
    }) 

Tôi không chắc chắn lý do tại sao sử dụng bộ lọc i có được ngoại lệ.

cũng xem trong tài liệu góc https://docs.angularjs.org/error/filter/notarray Kết quả của tôi là mảng nhưng không chắc chắn lý do tại sao tôi nhận được ngoại lệ như vậy.

Kết quả mẫu từ chương trình phụ trợ mà tôi đang nhận được.

[{"id":"135520b0-9e4b-11e5-a67e-5668957d0149","area":"Bingo","models":[],"enumerateds":[]},{"id":"0db925e0-9e53-11e5-a67e-5668957d0149","area":"jin","models":[],"enumerateds":[]},{"id":"7a717330-9788-11e5-b259-5668957d0149","area":"Product","models":[],"enumerateds":[]},{"id":"402d4c30-980f-11e5-a2a3-5668957d0149","area":"fgfgfg","models":[],"enumerateds":[]},{"id":"404b77b0-9e53-11e5-a67e-5668957d0149","area":"olah","models":[],"enumerateds":[]},{"id":"cd071b10-9e52-11e5-a67e-5668957d0149","area":"lolo","models":[],"enumerateds":[]},{"id":"d9808e60-9710-11e5-b112-5668957d0149","area":"catalog","models":[],"enumerateds":[]},{"id":"2aaca9f0-97e2-11e5-91cd-5668957d0149","area":"btg","models":[],"enumerateds":[]},{"id":"955e9ed0-978c-11e5-93fd-5668957d0149","area":"promotions","models":[],"enumerateds":[]},{"id":"1e441d60-980f-11e5-a2a3-5668957d0149","area":"hjuhh","models":[],"enumerateds":[]},{"id":"fb96dfe0-978d-11e5-93fd-5668957d0149","area":"voucher","models":[],"enumerateds":[]}] 

html

<li ng-repeat="g in graphs track by $index | filter:searchText"></li> 

Answer 1

Vấn đề đang xảy ra bởi vì bạn đang sử dụng track by $index trước khi bạn đang áp dụng bộ lọc của bạn. Để giải quyết vấn đề này, hãy thay đổi biểu thức của bạn thành:

<li ng-repeat="g in graphs | filter:searchText track by $index"></li> 

Biểu thức track by phải luôn ở cuối, sau tất cả các bộ lọc của bạn. một quy tắc của nó được đề cập trong tài liệu: ngRepeat

Giải thích:

Khi bạn không sử dụng track by $index trong ngRepeat, đầu vào cho tất cả các bộ lọc sử dụng là mảng, nghĩa là, nếu nó

ng-repeat="item in items | filter1 | filter2", 

thì items là đầu vào được chuyển đến bộ lọc theo mặc định và quá trình lọc được thực hiện trên đầu vào này.

Tuy nhiên, khi bạn sử dụng track by $index, đầu vào các bộ lọc trở nên $index thay vì items và do đó các lỗi:

Expected array(read: items) but received 0(read: $index).

Vì vậy, để đối phó với điều này, mảng là lần đầu tiên đi qua tất cả các bộ lọc và kết quả lọc được sử dụng với track by $index.

Hy vọng điều này sẽ xóa.

Answer 2

Bạn luôn nên sử dụng track by vào cuối biểu

<li ng-repeat="g in graphs | filter:searchText track by $index"></li> 

Kể từ khi đánh giá một biểu thức cho ng-repeat nhu cầu góc kết quả cuối cùng cho ca khúc bằng cách làm việc. Nếu bạn cung cấp nó ở cuối, bộ lọc của bạn sẽ được áp dụng và track by được tính trên đầu ra cuối cùng. Bạn có thể xem mã nguồn ở tài liệu góc.

Theo tài liệu của ng-repeat

If you are working with objects that have an identifier property, you should track by the identifier instead of the whole object. Should you reload your data later, ngRepeat will not have to rebuild the DOM elements for items it has already rendered, even if the JavaScript objects in the collection have been substituted for new ones. For large collections, this signifincantly improves rendering performance. If you don't have a unique identifier, track by $index can also provide a performance boost.