Aurelia：如何使用一些下拉菜单项创建主菜单

我是aurelia框架的新手。我尝试建立一个总共有7个项目的主菜单。前4项应该是顶级菜单项，最后3项是下拉菜单项。我与引导工作3Aurelia：如何使用一些下拉菜单项创建主菜单

在app.ts路由器配置的样子：

config.map([ 
    { route: ['', 'Buchungen'], 
    name: 'Buchungen', 
    moduleId: './buchung/app-buchung', 
    nav: true, title: 'Buchungen', 
    settings: {img:'./img/ic_tab_buchungen_white.png',t:'main_Buchungen',class:'fa fa-money'}}, 
    { route: 'Konten', 
    name: 'Konten', 
    moduleId: './konto/app-konto', 
    nav: true, 
    title: 'Konten', 
    settings: {img:'./img/ic_tab_konto_white.gif',t:'main_Konten',class:'fa fa-university' }}, 
    { route: 'Bilanz', 
    name: 'Bilanz', 
    moduleId: './bilanz/app-bilanz', 
    nav: true, 
    title: 'Bilanz', 
    settings: {img:'./img/ic_tab_bilanz_white.gif',t:'main_Bilanz',class:'fa fa-balance-scale'} }, 
    { route: 'Erfolg', 
    name: 'Erfolg', 
    moduleId: './erfolg/app-erfolg', 
    nav: true, 
    title: 'Erfolg', 
    settings: {img:'./img/ic_tab_erfolg_white.gif',t:'main_Erfolg',class:'fa fa-line-chart'} }, 
    { route: 'Chart', 
    name: 'Chart', 
    moduleId: './child-router', 
    nav: true, 
    title: 'Chart', 
    settings: {img:'./img/chart_line32.png',t:'menu_chart',class:'fa fa-area-chart'} }, 
    { route: 'export', 
    name: 'export', 
    moduleId: './child-router', 
    nav: true, 
    title: 'export', 
    settings: {img:'./img/ic_menu_export.png',t:'menu_export', class:'glyphicon glyphicon-log-out'}}, 
    { route: 'option', 
    name: 'option', 
    moduleId: './child-router', 
    nav: true, 
    title: 'option', 
    settings: {img:'./img/ic_menu_export.png',t:'menu_option', class:'glyphicon glyphicon-option-horizontal'}} 
]);

的NAV-一个bar.html的样子：

<div class="collapse navbar-collapse" id="aaccounting-navigation-navbar-collapse"> 
    <ul class="nav navbar-nav"> 
     <li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}"> 
     <a data-toggle="collapse" data-target="#aaccounting-navigation-navbar-collapse.in" href.bind="row.href" > 
      <i class="${row.settings.class}" aria-hidden="true"></i> 
      <span t.bind="row.settings.t">${row.title}</span> 
     </a> 
     </li>

在上面的html会有在连续7菜单项，但我喜欢做的下拉菜单，如：

<li> 
     <a href="#" data-toggle="dropdown" class="dropdown-toggle">Dropdown <b class="caret"></b></a> 
     <ul class="dropdown-menu"> 
      <li><a href="#">Action</a></li> 
      <li><a href="#">Another action</a></li> 
     </ul> 

     </li>

我如何能做到这一点与奥里利亚？

来源

2017-01-06 Mat Ro

也许，这个答案对你有帮助：https://stackoverflow.com/a/38444441/4921289

他的建议是将属性添加到您的路由配置设置的属性（你已经做了）下拉菜单项或主入口之间distinquish。

来源

2017-01-06 19:46:52

是的，这是解决方案（configRouter方法）。谢谢。 –

Aurelia：如何使用一些下拉菜单项创建主菜单

回答

相关问题