Question

我正在使用ui-router和状态提供程序来路由我的应用程序中的页面。我有以下状态写在州提供者。

.state('home', {
        url: '/home',
        templateUrl: 'public/msStream/stateFiles/stateHome.html',
        controller: 'stateHomeController'
    })

.state('home.profile', {
        url: '/home/profile',
        templateUrl: 'public/msStream/views/setting/ProfileBody.html'
      })

当我处于home州时。我的网址中添加了/home，但当我使用home.profile切换到$state.go("home.profile)州时，我的网址未更改为/home/profile，但templateurl中添加了HTML页面相同的状态正在前面呈现。

我尝试在状态的网址中添加/profile和/home/profile，但似乎没有任何效果。我在这里缺少什么？

Answer 1

我创建了working plunker here

paren-child州确实继承了很多。除此之外，还有 url 。所以我们不应该使用来自父母的网址部分。

$stateProvider
  .state('home', {
    url: '/home',
    templateUrl: 'public/msStream/stateFiles/stateHome.html',
    controller: 'stateHomeController'
  })
  .state('home.profile', {
    // HERE
    // instead of this
    // url: '/home/profile',
    // we need this
    url: '/profile',
    templateUrl: 'public/msStream/views/setting/ProfileBody.html'
  })

同样非常重要的注意事项 - 父母必须为其子女包含锚点/目标/ ui-view：

公开/ msStream / stateFiles / stateHome.html

<div> <h2>this is the home</h2> placeholder for child: <hr /> <div ui-view=""></div> </div>

最重要的是 <div ui-view=""></div> - 子视图的占位符（未命名）

检查行动here

即使状态发生变化，URL也不会改变。 `UI-router`

1 个答案: