更新了ngFor后备阵列后，Angular（单击）无法正常工作

Question

在following Angular code中，filteredList更新后点击事件不会触发：

<ul class="dropdown-menu" *ngIf="showOptions">
    <li *ngFor="let fund of filteredList" >
      <a (click)="selectFund(fund)">{{fund.name}}</a>
    </li>
</ul>

每次用户在文本输入中键入内容时，

filteredList都会更新。请注意，文本输入由FormControl对象支持，filteredList observable发送新数据时FormControl.valueChanges会更新。

<a>标记列表会相应更新，因此更改检测会按预期发生。唯一的问题是每次刷新后点击都不再有效。

让(click)侦听器再次工作的唯一方法是通过UI点击将showOptions切换为false然后返回true。

我必须遗漏一些东西，因为这应该可以完美地运作。

编辑：您可以在此处查看代码：https://stackblitz.com/edit/angular-click-issue。一切都在app.component.ts和app.component.html。如果选择下拉元素，则可以使用。如果在输入中键入过滤器，然后单击下拉元素，除非下拉列表关闭并重新打开，否则它不起作用。

Answer 1

问题来自更新(blur)="showOptions = false"的输入上的以下代码filteredList。

由于这些代码，我试图做一些有点冲突的事情（当我点击其中一个时隐藏选项），这会导致副作用。  我删除了(blur)绑定，一切正常！