如何將輸入值作為參數傳遞給Angularjs中的自定義過濾器

Question

我想將兩個參數傳遞給自定義過濾器“ from”和“ to”到我在控制器中創建的自定義過濾器中。

在這里，您可以看到我創建的自定義過濾器：

    vm.filterMinutes = function (prop, from, to) {
        return function (item) {
            return item[prop] >= from && item[prop] <= to;
        };
    };

並且視圖如下所示：

<label>Search from: <input ng-model="fromMinutes"></label>
<label>Search from: <input ng-model="toMinutes"></label>

    <tr style="cursor: pointer;" ng-repeat="student in AdminReportsWorksnaps.data | filter: AdminReportsWorksnaps.filterMinutes('totalMinutes', fromMinutes,toMinutes)">
                <td>{{ student.studentId }}</td>
                <td>{{ student.firstName }}</td>
                <td>{{ student.lastName }}</td>
                <td>{{ student.municipality }}</td>
                <td class="total success">{{ student.totalMinutes | number}}</td>
   </tr>

由於某種原因，這不起作用。 好吧，如果我這樣調用過濾器： filter: AdminReportsWorksnaps.filterMinutes('totalMinutes', 5000,6000)"它的工作原理就很好。我只是看不到如何從文本框中傳遞輸入值。

謝謝

Answer 1

將其作為:分開傳遞（假設您使用的是具有vm別名的controllerAs模式）

ng-repeat="student in AdminReportsWorksnaps.data | filter: AdminReportsWorksnaps.filterMinutes: 'totalMinutes': fromMinutes: toMinutes"

因此，在上述情況下，你需要期望在過濾器4的參數，第一個參數是AdminReportsWorksnaps.data ，第二個是totalMinutes ，第3 fromMinutes和最后將toMinutes值

vm.filterMinutes = function (collection, prop, from, to) {
    //collection would have 
    console.log("AdminReportsWorksnaps.data", collection)
    console.log(prop, from, to);
    return (collection || []).filter(function (item) {
        return item[prop] >= from && item[prop] <= to;
    });
};

Answer 2

看起來您正在使用controllerAs ，所以為什么也不要對模型使用controller別名：

<label>Search from: <input ng-model="AdminReportsWorksnaps.fromMinutes"></label>
<label>Search from: <input ng-model="AdminReportsWorksnaps.toMinutes"></label>

<tr style="cursor: pointer;" ng-repeat="student in AdminReportsWorksnaps.data | filter: AdminReportsWorksnaps.filterMinutes('totalMinutes', AdminReportsWorksnaps.fromMinutes, AdminReportsWorksnaps.toMinutes)">
    <td>{{ student.studentId }}</td>
    <td>{{ student.firstName }}</td>
    <td>{{ student.lastName }}</td>
    <td>{{ student.municipality }}</td>
    <td class="total success">{{ student.totalMinutes | number}}</td>

它應該像那樣工作。