Angular Typeahead：选择模糊

我使用从列表中选择一个值

但是，当我键入整个值并单击“外部”时，它不起作用

{{r.name}}
搜索一个状态：

模型：{Model | json}

Typescript

<input id="typeahead-template" type="text" class="form-control" 
  [(ngModel)]="model"  
  [ngbTypeahead]="search" 
  [resultTemplate]="rt"
  [inputFormatter]="formatter" 
  (blur)="onBlur(model)" />

从'@angular/core'导入{Component}；
从“rxjs”导入{Observable}；
从“rxjs/operators”导入{debounceTime，map}；
接口数据{
名称：字符串；
标志：字符串；
}
const statesWithFlags:{name:string，flag:string}[]=[
{'name'：'Alabama'，'flag'：'5/5c/flag_of_Alabama.svg/45px-flag_of_Alabama.svg.png'，
{'name'：'Alaska'，'flag'：'e/e6/flag_of_Alaska.svg/43px-flag_of_Alaska.svg.png'}，
{'name'：'Arizona'，'flag'：'9/9d/flag_of_Arizona.svg/45px-flag_of_Arizona.svg.png'}
];
@组成部分({
选择器：“ngbd typeahead模板”，
templateUrl:'src/typeahead template.html'，
样式：[`.form控件{宽度：300px；}`]
})
导出类NgbdTypeaheadTemplate{
公共模型：IStateData={}；
搜索=（文本$：可观察）=>
文本$.pipe(
去BounceTime（200），
映射（术语=>术语==''？[]
：statesWithFlags.filter（v=>v.name.toLowerCase（）.indexOf（term.toLowerCase（））>-1.slice（0,10））
);
格式化程序=（x:{name:string}）=>x.name；
}

当我从列表中选择一个项目或使用tab键时，效果很好。它可以正确设置模型值

问题：当我键入整个城市或粘贴该值并单击外部时，它不起作用。它基本上不是设置项目时，我模糊的类型前进

模型对象未正确设置，并在此处转换为字符串

注意：我需要类似于Ngx引导中的这个。

---

但他们还有其他悬而未决的问题。

将模糊事件添加到您的输入中

onBlur(search) {
  statesWithFlags.forEach(data => {
    if (search.toLowerCase() === data.name.toLowerCase()) {
      this.model = data;
    }
  })
}

检查这个工作示例

---

将模糊事件添加到输入中

onBlur(search) {
  statesWithFlags.forEach(data => {
    if (search.toLowerCase() === data.name.toLowerCase()) {
      this.model = data;
    }
  })
}

检查这个工作示例

onBlur(search) {
  statesWithFlags.forEach(data => {
    if (search.toLowerCase() === data.name.toLowerCase()) {
      this.model = data;
    }
  })
}