代码之家  ›  专栏  ›  技术社区  ›  alcfeoh

ngFor备份阵列更新后角度(单击)不工作

  •  1
  • alcfeoh  · 技术社区  · 7 年前

    following Angular code ,之后不会触发click事件 filteredList 已更新:

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

    过滤器列表 每次用户在文本输入中键入内容时都会更新。请注意,文本输入由 FormControl 对象,以及 过滤器列表 FormControl.valueChanges observable发送新数据。

    这个 <a> 标记列表会相应地更新,所以更改检测会按预期进行。唯一的问题是,每次刷新后,单击都不起作用。

    使 (click) 监听器的工作再次是切换 showOptions 通过用户界面单击设置为false,然后设置为true。

    我一定错过了什么,因为这应该很好用。

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

    1 回复  |  直到 7 年前
        1
  •  2
  •   alcfeoh    7 年前

    问题来自以下代码 (blur)="showOptions = false" 在更新 filteredList .

    由于这段代码,我试图做一些有点冲突的事情(在单击其中一个选项时隐藏选项),这导致了副作用。 我删除了 (blur) 装订和一切都很好!