Question

我有一张表，正在填充数据。所以，我想编写一个自定义过滤器，它将过滤某些范围内的数据（基本上是一个范围过滤器）。听起来很简单，但是当我实现它时，过滤器正在无限执行。

数据：

[{
    "id": 6,
    "columns": [
        {
            "header": "achievedPrice",
            "type": "number",
            "achievedPrice": 33190
        },
        {
            "header": "askingPrice",
            "type": "number",
            "askingPrice": 133
        }
    ]
},
{
    "id": 82,
    "columns": [
        {
            "header": "achievedPrice",
            "type": "number",
            "achievedPrice": 16784
        },
        {
            "header": "askingPrice",
            "type": "number",
            "askingPrice": 13556
        }
    ]
}]

表格

<tbody>
    <tr ng-repeat="row in readyData.rows | filter:numRange">
        <td ng-repeat="column in row.columns">
            {{ column[column.header] }}
        </td>
    </tr>
</tbody>

过滤

scope.numRange = function (list) {
                var min = 0; // DUMMY VALUE
                var max = 134; // DUMMY VALUE
                if (list.columns.length) {
                    for (var i = 0; i < list.columns.length; i += 1) {
                        if (list.columns[i].askingPrice) {
                            if (list.columns[i].askingPrice >= min && list.columns[i].askingPrice <= max) {
                                return true;
                            }
                        }
                    }
                }
                return false;
            };

它在表中显示正确的数据，但它无休止地执行。我尝试在一个新页面做同样的事情，它在那里工作正常。如果我使用Angular的过滤器（仅用于文本过滤），过滤器工作正常。

Answer 1

我发现了问题。这个范围过滤器没有任何问题，保存表数据的对象也包含一些其他数据，因此某些组件正在使用其他数据，该组件也使用过滤器，因此它们继续过滤主对象。

解决了这个问题，我在这些组件指令的范围内使用“@”来使它们成为只读而不是搞乱。

AngularJS自定义过滤器做无限循环的过滤功能

1 个答案: