Question

我有一个我用ng-repeat显示的项目列表。我想添加一个过滤器来显示/隐藏已归档的项目。

我添加了一个复选框：

<input type="checkbox" ng-model="queryFilter.archived">Show archived messages

在我的控制器中我有这个：

$scope.queryFilter = {
    archived: false
};

我的项目列表显示在表格中。我尝试了以下内容：

<tr ng-repeat="message in messages | filter : queryFilter">

<tr ng-repeat="message in messages | filter : { archived: queryFilter.archived }">

<tr ng-repeat="message in messages | filter : queryFilter track by $index">

我收到此错误：

错误：[filter：notarray]

预期数组但收到：{}

过滤确实有效，但我想知道为什么会收到错误。

Answer 1

＆lt; p＆gt;我初始化了＆lt; code＆gt;消息＆lt; / code＆gt;作为对象。＆lt; / p＆gt; ＆lt; p＆gt;更改＆lt; code＆gt; $ scope.messages = {};＆lt; / code＆gt;到＆lt; code＆gt; $ scope.messages = [];＆lt; / code＆gt;使错误消失。＆lt; / p＆gt;

Answer 2

您的messages必须包含Object形式的数据，而不是Array形式。

这就是抛出这个错误的原因。查看文档https://docs.angularjs.org/error/filter/notarray

来自文档：

过滤器必须与数组一起使用，以便项目的子集可以回。该数组可以异步初始化，因此 null或undefined不会抛出此错误。

因此，请确保您的$scope.messages包含数组形式的数据不是对象形式。

Answer 3

queryfilter是一个对象而不是一个数组。因此，在queryfilter上应用ng-repeat，如下所示 <tr ng-repeat = "message in messages | filter : queryFilter track by $index">

如果queryfilter是数组，那么只需使用

<tr ng-repeat = "message in messages | filter : queryFilter">

每当我们循环对象时，

跟踪$ index是必要的

Answer 4

$ index的轨道使得角度语法不正确，因为它直接位于过滤器指令的后面。尝试将其移至后面重复声明，以便在track by和filter语句之间有明确的分离。

<tr ng-repeat="message in messages | filter : queryFilter track by $index">

AngularJS ng-repeat with filter - notarray error

4 个答案: