[Angular 2] Pipes with Multiple Parameters
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的更多相关文章
- 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 ...
- JNI: Passing multiple parameters in the function signature for GetMethodID
http://stackoverflow.com/questions/7940484/jni-passing-multiple-parameters-in-the-function-signature ...
- [Angular Tutorial] 9 -Routing & Multiple Views
在这一步中,您将学到如何创建一个布局模板,并且学习怎样使用一个叫做ngRoute的Angular模块来构建一个具有多重视图的应用. ·当您现在访问/index.html,您将被重定向到/index.h ...
- WPF – pass multiple parameters to a Command
public class SendCommand : ICommand { public void Execute(object parameter) { var labels = ((object[ ...
- [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 ...
- EXEC sp_executesql with multiple parameters
传递多个参数 https://stackoverflow.com/questions/28481189/exec-sp-executesql-with-multiple-parameters http ...
- How to pass multiple parameters in PowerShell invoke-restmethod
Link: http://www.tagwith.com/question_322855_how-to-pass-parameters-in-powershell-invoke-restmethod- ...
- MyBatis3-传递多个参数(Multiple Parameters)
传递多个参数一般用在查询上,比如多个条件组成的查询,有以下方式去实现: 版本信息: MyBatis:3.4.4 1.自带方法 <select id="getUserArticlesBy ...
- Device trees, Overlays and Parameters of Raspberry Pi
Raspberry Pi's latest kernels and firmware, including Raspbian and NOOBS releases, now by default us ...
随机推荐
- WebDriverWait自定义等待事件
1. webDriverWait自定义WebElement类事件 public WebElement waitForElementVisible(WebDriver driver,final By l ...
- css清除浮动方法大全
清除浮动这个问题,做前端的应该再熟悉不过了,也是每一个web前台设计师 必须掌握的机能. 为什么浮动这么难? 因为浮动会使当前标签产生向上浮的效果,同时会影响到前后标签.父级标签的位置及 width ...
- Skinned Mesh原理解析和一个最简单的实现示例
Skinned Mesh 原理解析和一个最简单的实现示例 作者:n5 Email: happyfirecn##yahoo.com.cn Blog: http://blog.csdn.net/n5 ...
- js的引用顺序
注意:Bootstrap中的JS插件依赖于JQuery,因此JQuery要在Bootstrap之前引用!!! 把JS文件引用放入body的最下面,是为了使js在网页全部加载完后才起作用,比如你的js里 ...
- Node.js教程
Node.js是什么? Node.js是建立在谷歌Chrome的JavaScript引擎(V8引擎)的服务器端平台.Node.js是由瑞恩·达尔在2009年开发的,它的最新版本是v0.10.36. N ...
- Struts2拦截器总结<转>
由于项目中在登录跳转到其他应用程序模块的时候有用到拦截器,因此查看了一下相关资料. 原文地址:http://blog.csdn.net/sendfeng/article/details/4248120 ...
- Caption,Text,WindowText的区别——TControl也有FText,是为了模拟一个窗口
TControl = class(TComponent) // 控件的Windows功能从TControl开始 property Caption: TCaption read GetText writ ...
- Record Locks
Record Locks 记录锁: 记录锁是一个锁在一个Index记录上,比如 SELECT c1 FOR UPDATE FROM t WHERE c1 = 10; 阻止任何其他事务inserting ...
- c# 绘图常用对象和方法
//BitMap 位图,常用的方法, Save:主要方式有:(1)保存在图像文件里,可以指定格式[gif,bmp]:(2) 保存在流中,以指定格式[gif,bmp] //gra ...
- 解决VS2010中产生的ipch文件夹和sdf文件
纯粹参考他人博文,转载时注明参考链接!!! 参考链接: http://blog.sina.com.cn/s/blog_707a4cbf0100r5jq.html 在VS2010开发的项目中,ipch文 ...