如何在Angular *ngFor中使用语义UI下拉菜单？

Question

语义用户界面下拉菜单在*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 语义用户界面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.iong2-semantic-ui#modulesdropdown。