如何正确设置“过滤管道”,以便在组件输入字段中输入值,另一个组件显示搜索结果
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何正确设置“过滤管道”,以便在组件输入字段中输入值,另一个组件显示搜索结果相关的知识,希望对你有一定的参考价值。
如果它在一个组件中,那么一切都很好
<input class="top-input" type="text"
placeholder="Search..."
[(ngModel)]="term">
<div class="quiz-item" *ngFor="let test of tests | filter: term" (click)="passTestNotify(test)"> ...
但是我想在一个组件中输入一个值,而在另一个组件中,应该通过我在第一个组件中输入的变量“term”按名称过滤测试。
我不知道该怎么做。我的变种:Service,ViewChild,BehaviorSubject,另一个管道。请帮忙解决..
我的烟斗
@Pipe({
name: 'filter',
pure: false
})
export class FilterPipe implements PipeTransform {
transform(items: any[], term): any {
console.log('term', term);
return term
? items.filter(item => item.title.indexOf(term) !== -1)
: items;
}
}
答案
这是通过BehaviorSubject完成的。好东西)
以上是关于如何正确设置“过滤管道”,以便在组件输入字段中输入值,另一个组件显示搜索结果的主要内容,如果未能解决你的问题,请参考以下文章