我怎样才能通过一个过滤器进入的角度指令在NG-重复被使用？ [英] How can I pass a filter into an angular directive to be used in an ng-repeat?
问题描述
我想建立一个指令，这样我可以在这两个数据传递指令中使用，这将在它里面的NG-重复使用的特定的过滤器。这是行不通的，所以我想我接近整个问题是错误的。
I'm trying to set up a directive so that I can pass in both the data to be used in the directive, and the specific filter that will be used in the ng-repeat inside of it. This isn't working, so I assume I'm approaching the whole problem wrong.
我如何通过在过滤器？另外，我怎么prefilter /排序我通过列表中？
How do I pass in the filter? Alternatively, how do I prefilter/sort the list I'm passing in?
（范围必须被隔离，因为我想有在同一页上多个列表。）
(The scope must be isolated, because I want to have multiple lists on the same page.)
<!DOCTYPE HTML>
<html ng-app="MyApp">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script>
var myApp = angular.module('MyApp', []);
myApp.controller('mainPage',function($scope){
$scope.cars = ["Saab","Volvo","BMW"];
});
myApp.directive('carList',function(){
return {
scope: {
listOfCars: '=',
carFilter : '@'
},
restrict: 'E',
replace: 'true',
template: '<table>\
<tr ng-repeat="{{carFilter}}">\
<td>{{car}}</td>\
</tr>\
</table>'
};
});
</script>
</head>
<body ng-controller="mainPage">
<car-list list-of-cars="cars" car-filter='car in listOfCars | orderBy:"toString()"' ></car-list>
</body>
</html>
Plunker在它上面的code：
http://plnkr.co/edit/ipsF15?p=$p$pview
推荐答案
好了，我的认为的，这是一个可行的解决方案 - 而不是通过在过滤器中，通过在像这样过滤列表：
Ok, so I think this is a workable solution - rather than passing in the filter, pass in the filtered list like so:
<!DOCTYPE HTML>
<html ng-app="MyApp">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="angular.min.js"></script>
<script>
var myApp = angular.module('MyApp', []);
myApp.controller('mainPage',function($scope){
$scope.cars = ["Saab","Volvo","BMW"];
});
myApp.directive('carList',function(){
return {
scope: {
listOfCars: '&',
},
restrict: 'E',
replace: 'true',
template: '<table>\
<tr ng-repeat="car in listOfCars()">\
<td>{{car}}</td>\
</tr>\
</table>'
};
});
</script>
</head>
<body ng-controller="mainPage">
<car-list list-of-cars="cars | orderBy:'toString()' | limitTo:2 " ></car-list>
</body>
</html>
这不会觉得很直观。这是正确的做法？
Which doesn't feel very intuitive. Is this the right approach?
这篇关于我怎样才能通过一个过滤器进入的角度指令在NG-重复被使用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
