在Angular 2

Question

我试图做一个指向下拉，这就像Semantic UI的文档所说的那样，但是当我点击时它没有打开，我可能会遗漏一些东西，你们能帮助我吗？

<pre>
<div class="ui vertical menu">
  <div class="header item">
    Exemplos
  </div>
  <div class="ui left pointing dropdown link item">
    <i class="dropdown icon"></i>
    Imagem
    <div class="menu">
      <div class="item" routerLink="images" 
            RouterLinkActive="active">Reconhecimento de Objetos</div>
      <div class="item">Reconhecimento Facial</div>
    </div>
  </div>
</div>
</pre>

Answer 1

Semantic UI下拉模块需要一些JavaScript才能正常工作。要只显示要显示的菜单，可以使用angular来执行必要的Javascript工作。

<div class="ui vertical menu">
  <div class="header item">
    Exemplos
  </div>
  <div class="ui left pointing dropdown link item" ngClass="{'visible': showMenu, 'active': showMenu}">
    <i class="dropdown icon" (click)="showMenu = !showMenu"></i>
    Imagem
    <div class="menu" ngClass="{'visible': showMenu, 'hidden': !showMenu}">
      <div class="item" routerLink="images" 
            RouterLinkActive="active">Reconhecimento de Objetos</div>
      <div class="item">Reconhecimento Facial</div>
    </div>
  </div>
</div>

这不会应用具有适当时序的类来执行语义UI提供的动画。要做到这一点，你必须加载必要的js库（jQuery和语义js文件）并让它们与Typescript很好地配合。