Угловой UI-Router

Question

Я использую угловую предопределенную оболочку, чтобы создать базовый рабочий документ для моего нового проекта. Базовый шаблон загружается с помощью ng-include в index.html. Но другие представления связаны с компонентами меню с помощью ui-router. Все в кодовой части идеально подходит, но у меня возникает проблема при загрузке представлений при нажатии на пункты меню после запуска оболочки.

Я добавил теги href, чтобы проверить, работает ли это, но все равно бесполезно. Может кто-нибудь мне помочь.

<li ng-class="{active: $state.includes('app')}"> 
    <a href=""> 
     <i class="fa fa-desktop"></i> 
     <span class="nav-label">{{ 'APPVIEWS' | translate }}</span>       
     <span class="pull-right label label-primary">SPECIAL</span> 
    </a> 
    <ul class="nav nav-second-level" ng-class="{in: $state.includes('app')}"> 
     <li ui-sref-active="active"> 
      <a ui-sref="app.contacts">Contacts</a> 
     </li> 
    </ul> 
</li> 

Мои состояния в конфигурационном файле определяются как:

function config($stateProvider, $urlRouterProvider, $ocLazyLoadProvider, IdleProvider, KeepaliveProvider) { 
    IdleProvider.idle(5); 
    IdleProvider.timeout(120); 

    $urlRouterProvider.otherwise("/dashboards/dashboard_1"); 

    $ocLazyLoadProvider.config({ 
     debug: false 
    }); 

    $stateProvider 
     .state('app', { 
     abstract: true, 
     url: "/app", 
     templateUrl: "views/common/content.html", 
    }) 
    .state('app.contacts', { 
     url: "/contacts", 
     templateUrl: "views/contacts.html", 
     data: { pageTitle: 'Contacts' } 
    }) 
}  

Answer 1

Если «приложение» маршрут будет абстрактным вы можете взять URL с него

в app.contacts может иметь родитель приложение маршрута

$stateProvider 
    .state('app', { 
    "abstract": true, 
    templateUrl: "views/common/content.html", 
}) 

так что, когда я создал мой «приложение» маршрут, как абстрактные и хотел всю флористику просмотры г быть вложенным внутри этого маршрута я определил именованный вид, что они будут идти в

поэтому мой «приложение» шаблон будет как

// html stuff here for app 
<div ui-view="content"></div> 
// more html stuff here 

тогда мой app.contacts маршрут будет выглядеть

.state('app.contacts', { 
    parent: "app" 
    url: "/contacts", 
    views: { 
     "content": { 
      templateUrl: "views/contacts.html" 
     } 
    }, 
    data: { pageTitle: 'Contacts' } 
})