Question

在我的默认主页中，我有1个带有2个项目的导航栏。

主要用户视图的配置是：

angular.module('app').config([...
    $urlRouterProvider.otherwise('/mainpath');
    $stateProvider
      .state('mainpath', {
        url: '/mainpath',
        template: '<main-html></main-html>'
      });
... ]);

因此，当我访问我的网站时，默认情况下它将指向localhost：8080 / mainpath。但是，由于我的主页面中有一个包含2个项目的导航栏，因此我将所选项目设置为item1，而item1的md-nav-sref指向“item1State”。所以我期待当我去localhost：8080，它不会去localhost：8080 / mainpath，但会直接转到localhost：8080 / mainpath / item1 ..这里我的意思是URL会改变，但内容因为我的main-html文件包含导航栏，所以是相同的。我只是希望item1 html加载到main-html的ui-view中，目前还没有发生。

默认情况下加载的视图的配置是：

angular.module('app').config([...
    $stateProvider
      .state('item1State', {
        url: '/item1',
        template: '<item1></item1>'
      })
      .state('item2State', {
        url: '/item2',
        template: '<item2></item2>'
      });
... ]);

当我尝试切换到不同的导航栏项时，我收到错误：“无法从状态'mainpath'解析'item1'”，与item2相同。所以我遇到了两个问题，一个是我期待我的url将是localhost：8080 / mainpath / item1，因为我在加载主页时默认选择了navbar item1。选择导航栏项时，接下来是此错误。我是angularjs的新手，我希望你明白。感谢

Answer 1

你的两个路由器是分开的，你没有嵌套它们。要在子节点中使用父路由，您需要以这种方式进行配置。

$stateProvider
.state('contacts', {
    abstract: true,
    url: '/contacts',

    // Note: abstract still needs a ui-view for its children to populate.
    // You can simply add it inline here.
    template: '<ui-view/>'
})
.state('contacts.list', {
    // url will become '/contacts/list'
    url: '/list'
    //...more
})
.state('contacts.detail', {
    // url will become '/contacts/detail'
    url: '/detail',
    //...more
})

更多信息here

angular.js：13550错误：无法解决状态'mainpath'

1 个答案: