如何在 angular *ngFor 中使用语义 ui 下拉菜单

Question

语义 ui 下拉列表在 *ngFor 外工作正常，但在 *ngFor 内它不起作用。有解决办法吗？

<div *ngFor="let task of taskList">
  <div class="ui fluid multiple search selection dropdown">
    <input type="hidden" name="country">
    <i class="dropdown icon"></i>
    <div class="default text">Select Country</div>
    <div class="menu">
      <div class="item" data-value="af"><i class="af flag"></i>Afghanistan</div>
      <div class="item" data-value="ax"><i class="ax flag"></i>Aland Islands</div>
      <div class="item" data-value="al"><i class="al flag"></i>Albania</div>
      <div class="item" data-value="dz"><i class="dz flag"></i>Algeria</div>
      <div class="item" data-value="as"><i class="as flag"></i>American Samoa</div>
      <div class="item" data-value="zm"><i class="zm flag"></i>Zambia</div>
      <div class="item" data-value="zw"><i class="zw flag"></i>Zimbabwe</div>
    </div>
  </div>
</div>

Answer 1

你在使用 ng2-semantic-ui 作为语义 UI Javascript 方面吗？

如果没有，请安装：

npm install --save ng2-semantic-ui

并像这样使用：

<div class="ui dropdown" suiDropdown>
    <div class="menu" suiDropdownMenu>
    <div class="item" *ngFor="let task of taskList">
        your item
    </div>
    </div>
</div>

完整文档：https://edcarroll.github.io/ng2-semantic-ui/#/modules/dropdown

如何在 angular *ngFor 中使用语义 ui 下拉菜单

How to use semantic ui dropdown inside angular *ngFor

angular

semantic-ui