我尝试在 alpha 22 版的 Angular 2 应用程序中进行过滤。我尝试了很多方法,但没有任何效果...
<table class="tabulka">
<tr>
<th>ID</th><th>Typ</th><th>Priorita</th><th>Aplikace</th><th>Souhrn</th><th>Hlásil</th><th>Stav</th><th>Termín</th><th>Akce</th>
</tr>
<tr *for="#x of datas">
<td>{{x.ID}}</td>
<td>{{x.Type}}</td>
<td *if="x.Priority == 1" ><img src="./img/red.png"></td>
<td *if="x.Priority == 0"></td>
<td>{{x.Aplication}}</td>
<td>{{x.Summary}}</td>
<td>{{x.Person}}</td>
<td>{{x.State}}</td>
<td>{{x.Date}}</td>
<td class="edit" id="{{x.ID}}"><a href="./editTicket.html">Upravit</a></td>
</tr>
</table>
求助!你如何使用 typescript 在 Angular 2 中进行过滤?
在 angular 1.4.x 中它是这样工作的:
<table class="tabulka">
<tr ng-repeat="x in datas| filter:searchText|filter:{Aplication:search}| filter:{Person:podle}">
<td>{{x.ID}}</td>
<td>{{x.Type}}</td>
<td>{{x.Priority}}</td>
<td>{{x.Aplication}}</td>
<td>{{x.Summary}}</td>
<td>{{x.Person}}</td>
<td>{{x.State}}</td>
<td>{{x.Date}}</td>
<td class="edit" id="{{x.ID}}"><a href="./editTicket.html">Upravit</a></td>
</tr>
</table>
最佳答案
在 Angular 2.0.0-beta.0 中,您需要实现一个管道,根据您的应用程序需要转换数组,
@Pipe({
name: 'search'
})
export class SearchTextPipe implements PipeTransform {
transform(value: any[] , args: any[]) {
const searchText = args[0];
const field = args[1];
if (!searchText) {
return value;
}
return value.filter ((item) => {
if (field) {
return item[field].includes(searchText);
}
return _(item)
.values()
.includes( searchText );
})
}
}
然后你可以在其他组件中使用它:
@Component({
...
pipes: [SearchTextPipe]
})
在模板中:
*ngFor="#item of list | search:searchInput:field"
关于javascript - Angular 2 过滤,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32267562/