如何在选择结果后清除预先输入？

我正在使用 ng-bootstrap typeahead组件来搜索客户数据库.当用户从预先输入结果列表中选择客户时,我会导航到客户详细信息页面.我有这个工作,但我想在导航发生后清除输入字段.我已经尝试将模型设置为null或selectItem事件逻辑中的空字符串,但这不起作用：

客户搜索typeahead.component.html

<template #resultTemplate let-r="result" let-t="term">
  <div>
    <div>
      {{r.resource.name[0].given}} {{r.resource.name[0].family}}
    </div>
    <div>
      {{r.resource.birthDate | date: 'dd/MM/yyyy'}}
    </div>
  </div>
</template>

<input type="text" class="form-control" [resultTemplate]="resultTemplate" (selectItem)="onSelect($event)"
       [(ngModel)]="model" placeholder="Start typing a customer name..." [ngbTypeahead]="search"/>

客户搜索typeahead.component.ts

@Component({
  selector: 'customer-search-typeahead',template: require('./customer-search-typeahead.component.html'),styles: [`.form-control { width: 300px; }`]
})
export class CustomerSearchTypeaheadComponent {

  model: any;
  searching: boolean;

  constructor(private customerService: CustomerService,private router: Router) {}

  onSelect($event) {
    this.router.navigate(['/customers',$event.item.resource.id]);
    this.model = null;
  };

  search = (text$: Observable<string>) =>
   //omitted for brevity
}

选择完成后,预先输入如下所示：

解

客户搜索typeahead.component.html

<input type="text" class="form-control" #input [ngbTypeahead]="search" (selectItem)="onSelect($event); input.value='' ">

客户搜索typeahead.component.ts

onSelect($event,input) {
    $event.preventDefault();
    this.router.navigate(['/customers',$event.item.resource.id]);
  };

onSelect($event,input) {
    $event.preventDefault();
    this.selected.push($event.item);
    input.value = '';
  }

<input type="text" class="form-control" #input 
   [ngbTypeahead]="search" (selectItem)="onSelect($event,input)">