[英]How to pass input values as arguments into the custom filter in Angularjs
I want to pass two argument to the custom filter ' from' and 'to' into the custom filter I have created in my controller. 我想将两个参数传递给自定义过滤器“ from”和“ to”到我在控制器中创建的自定义过滤器中。
Here you can see my custom filter I have created: 在这里,您可以看到我创建的自定义过滤器:
vm.filterMinutes = function (prop, from, to) {
return function (item) {
return item[prop] >= from && item[prop] <= to;
};
};
And the view looks like this: 并且视图如下所示:
<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>
For some reason this is not working. 由于某种原因,这不起作用。 Well, If I Call filter like this:
filter: AdminReportsWorksnaps.filterMinutes('totalMinutes', 5000,6000)"
it works perfectly fine.. I just cant see how can I pass the input values from the textboxs. 好吧,如果我这样调用过滤器:
filter: AdminReportsWorksnaps.filterMinutes('totalMinutes', 5000,6000)"
它的工作原理就很好。我只是看不到如何从文本框中传递输入值。
Thanks 谢谢
Pass it as :
separated (Assuming you are using controllerAs
pattern with vm
alias) 将其作为
:
分开传递(假设您使用的是具有vm
别名的controllerAs
模式)
ng-repeat="student in AdminReportsWorksnaps.data | filter: AdminReportsWorksnaps.filterMinutes: 'totalMinutes': fromMinutes: toMinutes"
So in above case you need to expect 4 parameter in a filter, 1st parameter would be AdminReportsWorksnaps.data
, 2nd would be totalMinutes
, 3rd fromMinutes
& last would be toMinutes
value 因此,在上述情况下,你需要期望在过滤器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;
});
};
It look like you're using a controllerAs
, so why don't use the controller alias for the models too : 看起来您正在使用
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>
It should works like that. 它应该像那样工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.