Question

当我点击每个应用程序时，我有一个页面显示了我希望能够转到应用程序详细信息页面的应用程序列表。这是我的配置：

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认为我相对指向州，但我想以绝对的方式做。

Answer 1

问题是父母姓名 'home.app' 而不是 'home.apps'

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

因为父母是

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

EXTEND以防万一，这不应该是'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', {

无法从状态“home.apps.list”，UI-Router解析状态“home.app.detail”

1 个答案: