项目需求：
全局搜索 + 防抖 提高性能
技术：
[(ngModel)] [(ngModelChange)] Rxjs( Subject)
代码展示：
// html
<input type="text" placeholder="Search" [(ngModel)]="globalSearchContent" (ngModelChange)="globalSearch()">
// xx.component.ts
import { Observable, combineLatest, Subject } from 'rxjs';
import { distinctUntilChanged, debounceTime } from 'rxjs/operators';
private searchStream = new Subject<string>();
ngOnInit() {
// 订阅
this.initGlobalSearchSubscription();
}
ngOnDestroy() {
// 取消订阅
this.searchStream.unsubscribe();
}
private async initGlobalSearchSubscription() {
this.projectId = await this.localStorageService.getItem('currentProject');
this.searchStream.pipe(
debounceTime(400),
distinctUntilChanged())
.subscribe(async(searchContent) => {
const searchResult = await this.projectService.globalSearch(this.projectId, searchContent).toPromise();
this.searchMenuList = searchResult.body;
});
}
private globalSearch() {
// 消息发送
this.searchStream.next(this.globalSearchContent);
}