Question

根据angular.io中的教程和示例以及bootstrap中的静态导航栏，我在app.component

的模板中有此代码段

<li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">My Company <span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li><a [routerLink]="['MyProfilePage']">Profile</a></li>
        <li><a [routerLink]="['MyCataloguePage']">Catalogue</a></li>
        <li><a [routerLink]="['MyQuotationPage']">Products on Sale</a></li>
        <li><a [routerLink]="['MyContractsPage']">Contracts</a></li>
      </ul>
</li>

但是，单击下拉按钮时没有任何反应。最初的<a class="dropdown-toggle">有一个href，但由于我没有路径，因此无法工作。我尝试使用内部<li>创建另一个组件，这样我就可以在下拉切换中添加[routerLink]，但它给出了一个关于如何不允许子路径的错误。

关于如何实现下拉列表工作的任何想法都像上面的bootstrap链接一样？谢谢。

Answer 1

我遇到了同样的问题。解决方案是你需要使用正确的derective：

从'ng2-bs-dropdown / dropdown'导入{DROPDOWN_DIRECTIVES};

并且不要忘记在组件中使用它：

指令：[ROUTER_DIRECTIVES，DROPDOWN_DIRECTIVES]

这就是全部。我希望这适合你。

使用Angular2.0和Bootstrap创建下拉选项卡

1 个答案: