активный дескриптор класса для родительских/дочерних маршрутизаторов в aurelia

Question

Являясь новым для aurelia, у меня есть главное меню в левой части, у одного из меню (почты) есть подменю (inbox, sent, trash). мне нужно сделать, если подменю активно (#current URL, #activeclass, #CSS) необходимо сохранить активный класс для родительского меню (mail). app.js

экспорт класс App {

configureRouter(config, router){ 
    config.title = 'DMS'; 

    config.map([ 
     { route: ['dashboard',''], name: 'Dashboard', 
      moduleId: './templates/dashboard/dashboard', nav: true, title:'Dashboard',settings:{'img' : 'ic-dashboard.png'} }, 
     { route: ['settings'], name: 'Settings', 
      moduleId: './templates/settings/settings', nav: true, title:'Settings' ,settings:{'icon' : 'settings'} }, 
     { route: ['inbox'], name: 'inbox', 
      moduleId: './templates/mail/inbox/inbox', nav: true, title:'Mail' ,settings:{'img' : 'mail.png'} }, 
     { route: ['inbox/trash'], name: 'trash', 
      moduleId: './templates/mail/trash/trash', title:'Mail' }, 
     { route: ['inbox/sent'], name: 'sent', 
      moduleId: './templates/mail/sent/sent', title:'Mail'}, 
    ]); 

    this.router = router; 
} 
} 

список Меню также применение активного класса

<div class="row col s12 ${row.isActive ? 'active' : ''}" repeat.for = "row of router.navigation" > 
     <a href.bind = "row.href"> 
     <div class="col s2 " > 
      <div if.bind="row.settings.img"> 
       <img src="src/assets/${row.settings.img}"> 
      </div> 
      <div if.bind="row.settings.icon"> 
       <i class="tiny material-icons">${row.settings.icon}</i> 
      </div> 
     </div> 
     </a> 
    </div> 

подменю URL

<div class="col s8 offset-s2 mail_actionLst"> 
        <ul> 
         <li class="inbox mail_active"><a href="#/inbox"> Inbox &nbsp; <span>(43)</span></a> </li> 
         <li class="sent"><a href="#/inbox/sent">Sent</a> </li> 
         <li class="trash"><a href="#/inbox/trash">Trash</a></li> 
        </ul> 
       </div> 

Как установить родительский класс активен.

Answer 1

Потому что это разные маршруты, а не родители + дети. Вы должны описать дочерний маршрут в родительском классе. Вы можете добавить код inbox.js

configureRouter(config, router){ 

    config.map([ 
     { route: ['trash'], name: 'trash', 
      moduleId: 'path_to_trash', title:'Mail' }, 
     { route: ['sent'], name: 'sent', 
      moduleId: 'path_to_sent', title:'Mail'}, 
    ]); 

    this.router = router; 
    } 

Не забудьте добавить

<router-view></router-view> 

в inbox.html