Angular2 несколько пользовательских труб
Я строю приложение angular2, используя es5. У меня есть один экран, где у меня есть два поля ввода поиска, чтобы отфильтровать два разных списка.
Для этого я определил две разные трубы, как указано ниже
(function(app) {
app.filterPipe1 = ng.core.Pipe({
name : "filter1",
pure:true
}).Class({
constructor : function() {
}, // <<< ---
transform : function(values, args) {
return values.filter(function(value) {
return value.title.toLowerCase().startsWith(args[0].toLowerCase());
});
}
});
})(window.app || (window.app = {}));
(function(app) {
app.filterPipe2 = ng.core.Pipe({
name : "filter2",
pure:true
}).Class({
constructor : function() {
}, // <<< ---
transform : function(values, args) {
return values.filter(function(value) {
return value.title.toLowerCase().startsWith(args[0].toLowerCase());
});
}
});
})(window.app || (window.app = {}));
component1.js
app.component1 = ng.core
.Component(
{
directives : [ ng.router.ROUTER_DIRECTIVES,
app.componenttest ],
pipes : [ app.filterPipe1,app.filterPipe2 ],
templateUrl : 'test1.html'
})
Я получаю ниже ошибки при запуске "Не удается найти трубу"
Также интересно то, что когда я удаляю любое из объявлений из каналов в компоненте, оно работает.
обновленный
Используемый фильтр в HTML, как показано ниже
<input type="text" placeholder="Search"
[(ngModel)]="inputSearch1">
<li
*ngFor="#category of categoryList | filter1:inputSearch1 #i=index">
<input type="text" placeholder="Search"
[(ngModel)]="inputSearch2">
<li
*ngFor="#objective of objectiveList | filter2:inputSearch2 #i=index">
Кто-нибудь сталкивался с этой проблемой?