Angular2如何清空观察到流

Question

我采用了棱角分明2.0.0 beta.0和打字稿1.7.5

当您在搜索框的东西，东西被发现，显示在屏幕上，然后你删除搜索输入框，你想显示一个空的列表。它使用这段代码： this.searchTermStream.next("makesureyoudontfindanything");

有没有人有更好的清洁解决方案，而不做一个http请求？

@Component({ 
    selector: 'contact-search', 
    template: ` 
     <div class="container"> 
      <div class="form-group"> 
       <label for="inputUser">Search</label> 
       <input #inputUser (keyup)="search(inputUser.value)"> 
      </div> 
      <ul> 
       <li *ngFor="#contact of contactList | async">{{contact.name}}</li> 
      </ul> 
     </div> 
    ` 
}) 

export class ContactSearch { 

    private searchTermStream = new Subject<string>(); 

    private contactList: Observable<Contact[]> = this.searchTermStream 
     .debounceTime(300) 
     .distinctUntilChanged() 
     .switchMap((value: string) => this.contactService.searchContacts(value)) 

    constructor(private contactService: ContactService) {} 

    search(value: string) { 
     if (value) { 
      this.searchTermStream.next(value); 
     } 
     else { 
      this.searchTermStream.next("makesureyoudontfindanything"); 
     } 
    } 
} 

Answer 1

您可以检查是否值是在调用服务之前空：

private contactList: Observable<Contact[]> = this.searchTermStream 
    .debounceTime(300) 
    .distinctUntilChanged() 
    .switchMap((value: string) => 
     0 < value.length ? this.contactService.searchContacts(value) : Observable.of([])) 

search(value: string) { 
    this.searchTermStream.next(value); 
}