Showing How to set up a Pipe, takes multiple updating inputs for multiple Component sources.
Import {Component, View, Ngfor, form_directives} from ' Angular2/angular2 '; import {Todoservice} from'./todoservice '; import {Todoitemrender} from'./todoitemrender '; import {StartsWith} from'./startswith '; import {Simplesearch} from'./simplesearch '; import {letterselect} from'./letterselect '; import {Todosearch} from'./todosearch '; @Component ({selector:' Todo-list '}) @View ({pipes: [StartsWith, Simplesearch], directives: [Ngfor, Todoitemrender, Form_directives, Letterselect, Todosearch], Template: '<div> <todo-search #todo-search></todo-search>{{Todosearch.term}}<todo-item-Render*ng- for="#todo of Todoservice.todos | simplesearch: [' title ', ' Action '] : Todosearch.term"[Todoinput]= "Todo" > </todo-item-render> </div> `}) Export class todolist{Constructor (public todoservice:todoservice) {}}
Import {Pipe} from ' Angular2/angular2 '; @Pipe ({ ' simplesearch ', false}) Export class simplesearch{ transform (value, [fields, letter]:[string[], string]) { return value. Filter (item) = Fields . Some(field) = Item[field]. Includes(letter)) );} }
[Angular 2] Pipes with multiple Parameters