filter:notarray预期的数组但收到:0

Sau*_*mar 18 javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat

调节器

    @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();
    }
Run Code Online (Sandbox Code Playgroud)

角度呼叫

    $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();
      }
     };
    })
Run Code Online (Sandbox Code Playgroud)

我不知道为什么使用过滤器我得到了例外.

也看了角度文档https://docs.angularjs.org/error/filter/notarray 我的结果是数组,但不知道为什么我得到这样的异常.

来自后端的示例结果我得到了.

[{"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":[]}]
Run Code Online (Sandbox Code Playgroud)

HTML

<li ng-repeat="g in graphs track by $index | filter:searchText"></li>
Run Code Online (Sandbox Code Playgroud)

Tar*_*gar 68

问题出现是因为您track by $index在应用过滤器之前使用了该问题.要解决此问题,请将表达式更改为:

<li ng-repeat="g in graphs | filter:searchText track by $index"></li>
Run Code Online (Sandbox Code Playgroud)

track by在所有过滤器之后,表达式应始终位于最后.它是文档中提到的规则:ngRepeat

说明:

当您不使用track by $indexin时ngRepeat,所使用的所有过滤器的输入都是数组,即,如果是

ng-repeat="item in items | filter1 | filter2", 
Run Code Online (Sandbox Code Playgroud)

然后items是默认传递给过滤器的输入,并在此输入上完成过滤.

但是,当您使用时track by $index,过滤器的输入变为$index而不是items错误:

预期的数组(读取:项目)但收到0(读取:$ index).

因此,为了解决这个问题,首先将数组传递给所有过滤器,并使用过滤后的结果track by $index.

希望这清除它.

  • 它是文档中提到的规则.应在轨道之前按表达式应用过滤器.请参阅文档:https://docs.angularjs.org/api/ng/directive/ngRepeat (3认同)