Showing how to set up a Pipe that 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({
name: 'simpleSearch',
pure: 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的更多相关文章

  1. Can't bind multiple parameters ('header' and 'parameters') to the request's content.

    2019-01-23 15:46:29.012+08:00 ERROR [6]: System.InvalidOperationException: Can't bind multiple param ...

  2. JNI: Passing multiple parameters in the function signature for GetMethodID

    http://stackoverflow.com/questions/7940484/jni-passing-multiple-parameters-in-the-function-signature ...

  3. [Angular Tutorial] 9 -Routing & Multiple Views

    在这一步中,您将学到如何创建一个布局模板,并且学习怎样使用一个叫做ngRoute的Angular模块来构建一个具有多重视图的应用. ·当您现在访问/index.html,您将被重定向到/index.h ...

  4. WPF – pass multiple parameters to a Command

    public class SendCommand : ICommand { public void Execute(object parameter) { var labels = ((object[ ...

  5. [Angular 2] Select From Multiple Nested Angular 2 Elements

    You have complete control over the elements you nest inside of your component instance by using sele ...

  6. EXEC sp_executesql with multiple parameters

    传递多个参数 https://stackoverflow.com/questions/28481189/exec-sp-executesql-with-multiple-parameters http ...

  7. How to pass multiple parameters in PowerShell invoke-restmethod

    Link: http://www.tagwith.com/question_322855_how-to-pass-parameters-in-powershell-invoke-restmethod- ...

  8. MyBatis3-传递多个参数(Multiple Parameters)

    传递多个参数一般用在查询上,比如多个条件组成的查询,有以下方式去实现: 版本信息: MyBatis:3.4.4 1.自带方法 <select id="getUserArticlesBy ...

  9. Device trees, Overlays and Parameters of Raspberry Pi

    Raspberry Pi's latest kernels and firmware, including Raspbian and NOOBS releases, now by default us ...

随机推荐

  1. Oracle数据库之视图与索引

    Oracle数据库之视图与索引 1. 视图简介 视图是基于一个表或多个表或视图的逻辑表,本身不包含数据,通过它可以对表里面的数据进行查询和修改. 视图基于的表称为基表,视图是存储在数据字典里的一条SE ...

  2. underscorejs-partition学习

    2.25 partition 2.25.1 语法: _.partition(list, predicate, [context]) 2.25.2 说明: 拆分list为两个数组. 第一个数组的元素都满 ...

  3. [翻译]jQuery十周年-John Resig

    10th Anniversary of jQuery Today marks the 10th anniversary of the release of jQuery...[原文] 今天是jQuer ...

  4. __call方法简介

    作用:当程序试图调用不存在或不可见的成员方法时,PHP会先调用__call方法来储方法名及参数. __call方法包含两个参数:即方法名和方法参数.其中,方法参数是以数组形式存在的.

  5. mac 自带 php 验证码 不显示

    curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 在命令行中输入上面   ,最后5.5是php版本号 自动安装FreeType ----- ...

  6. C缩写

    STL:Standard Template Library,标准模板库

  7. Vim C/C++的一键编译

    开始用Vim差不多有两个月的时间, 一开始用Makefile 编译一整个项目无压力, 但是当写到单个文件的时候, 编译就比较麻烦了, 每次都得 :w :!gcc -o 1.exe 1.c :!1 非常 ...

  8. Rss web 工具 大对比

    今天终于神受不了 feedly的链接死掉了..有时候挂代理就好了..但是麻烦. 于是: AOL reader Digg  reader feedly 对比下.使用了一天 1.feedly 优: 效果最 ...

  9. 如何从BBC网站学习英语

  10. ios入门之c语言篇——基本函数——3——判断日期是一年的第几天

    3.判断日期是一年的第几天 参数返回值解析: 参数: y:int,年份: m:int,月份 d:int,日期 返回值: sum:传入日期是当年的第几天: 函数解析: leapyear(y);判断y是不 ...