[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 ...
随机推荐
- PowerDesigner 的7种建模文件
1. 概念数据模型 (CDM) 对数据和信息进行建模,利用实体-关系图(E-R图)的形式组织数据,检验数据设计的有效性和合理性. 2. 逻辑数据模型 (LDM) PowerDesigner 15 ...
- jQuery慢慢啃筛选(四)
1.eq(index|-index) 获取第N个元素 其中负数:一个整数,指示元素的位置,从集合中的最后一个元素开始倒数.(1算起) $("p").eq(1)//获取匹配的第二个元 ...
- Tenth Line
How would you print just the 10th line of a file? For example, assume that file.txt has the followin ...
- Meta元素可视区
一.网页手机wap2.0网页的head里加入下面这条元标签,在iPhone的浏览器中页面将以原始大小显示,并不允许缩放. <meta name="viewport" cont ...
- FC8下备份linux系统
linux系统可以使用tar来备份.<br><br> 我在FC8上装好了totem, mplayer, audacious, 并搞定了wifi后,我觉得该备份一下FC8系统.& ...
- 汇总前端最最常用的JS代码片段
html5选择器 //参数均接收一个合法的css选择器 element = document.querySelector('.foo,.bar');//返回带有foo或者bar样式类的首个元素 ele ...
- BZOJ 1020 安全的航线flight
Description 在设计航线的时候,安全是一个很重要的问题.首先,最重要的是应采取一切措施确保飞行不会发生任何事故,但同时也需要做好最坏的打算,一旦事故发生,就要确保乘客有尽量高的生还几率.当飞 ...
- Ruby on Rails创始人DHH谈如何进行混合移动APP开发
混合型APP兼具原生型APP软件良好用户交互体验的优势和网页型APP软件跨平台开发的优势,并且其开发成本和网页型APP软件接近,其开发效率也远高于原生型APP软件.混合型APP已经被众多企业所认可.最 ...
- h.264直接预测
直接预测是B帧上一种独有的预测方式,其中直接预测又分为两种模式: 时域直接模式(temporal direct).空域直接模式(spatial direct). 在分析这两种模式之前,有一个前提概念需 ...
- 疯狂java讲义笔记 2.3.7
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools=&q ...