2015-07-09 3 views
2

У меня есть страница, показывающая список приложений, которые я хочу, чтобы иметь возможность перейти на страницу деталей приложения, когда я нажимаю на каждый из них. Вот мой конфиг:не удалось разрешить состояние «home.app.detail» из состояния «home.apps.list», UI-Router

module bandar { 
    'use strict'; 

    export class RouterConfig { 
    /** @ngInject */ 
    constructor($stateProvider: ng.ui.IStateProvider, 
       $urlRouterProvider: ng.ui.IUrlRouterProvider, 
       $locationProvider: ng.ILocationProvider) { 
     $stateProvider 
     .state('home', { 
      url: '', 
      abstract: true, 
      templateUrl: 'app/components/main/main.html', 
      controller: 'MainController', 
      controllerAs: 'mainCtrl' 
     }) 
     .state('home.apps', { 
      url: '/apps', 
      abstract: true, 
      templateUrl: 'app/components/apps/apps.html', 
      controller: 'AppsController', 
      controllerAs: 'appsCtrl', 
     }) 
     .state('home.apps.list', { 
      url: '', 
      templateUrl: 'app/components/apps/list.html', 
     }) 
     .state('home.app.detail', { 
      url: '/app/:package_name', 
      templateUrl: 'app/components/apps/app.html', 
      controller: 'AppController', 
      controllerAs: 'appCtrl', 
     }); 

     $urlRouterProvider.otherwise('/apps'); 
     /*$locationProvider.html5Mode(true).hashPrefix('');*/ 
    } 
    } 
} 

А вот часть шаблона списка, который анкерной к деталям странице приложения:

<a ui-sref="home.app.detail({package_name: app.package_name})">{{app.title}}</a> 

Но когда я ударил его в моем браузере следующее сообщение об ошибке происходит в консоли:

Error: Could not resolve 'home.app.detail' from state 'home.apps.list' 
    at Object.transitionTo (angular-ui-router.js:3140) 
    at Object.go (angular-ui-router.js:3068) 
    at angular-ui-router.js:4181 
    at angular.js:17682 
    at completeOutstandingRequest (angular.js:5387) 
    at angular.js:5659 

Я думаю, проблема UI-Router думает, что я, указывая на состояние относительно, но я хочу сделать это в абсолютном пути.

ответ

2

Проблема заключается родитель имя 'home.app' вместо 'home.apps'

// wrong 
.state('home.app.detail', { ... 
// should be 
.state('home.apps.detail', { ... 

, потому что родитель

.state('home.apps', { ... 

ПРОДЛИТЕ в случае, что это не должно быть ребенка 'home.apps' мы имеем опционы

1) не вносить рит на всех

.state('detail', { ... 

2) ввести родителя (ей), который (которые) используется в дот-гос-имя нотации

// exists already 
.state('home', { ... 
// this parent must be declared to be used later 
.state('home.app', { 
// now we can use parent 'home.app' because it exists 
.state('home.app.detail', { 
+0

Нет, я не хочу, чтобы ребенок из 'home.apps' ... – Masious

+0

Ну, тогда у вас есть два варианта, оба в моем расширенном ответе. –

Смежные вопросы