即使状态改变,URL 也不会改变.`用户界面路由器` [英] URL is not changing even after the state is changed . `ui-router`
问题描述
我正在使用 ui-router
和状态提供程序来路由我的应用程序中的页面.我有以下状态提供者写的状态.
.state('home', {网址:'/家',templateUrl: 'public/msStream/stateFiles/stateHome.html',控制器:'stateHomeController'}).state('home.profile', {url: '/home/profile',templateUrl: 'public/msStream/views/setting/ProfileBody.html'})
当我处于 home
状态时./home
添加到我的 URL 中,但是当我使用 $state.go("home.profile)
切换到 home.profile
状态时,我的 URL 没有更改为 /home/profile
但添加到 templateurl
中的 HTML 页面相同状态正在呈现在前面.
我尝试在状态的 URL 中添加 /profile
和 /home/profile
但似乎没有任何效果.我在这里错过了什么?
我在这里创建了工作plunker
父子状态确实继承了很多.除其他外,还有 url
.所以我们不应该将来自父级的 url 部分用于子级.
$stateProvider.state('家', {网址:'/家',templateUrl: 'public/msStream/stateFiles/stateHome.html',控制器:'stateHomeController'}).state('home.profile', {//这里//而不是这个//url: '/home/profile',//我们需要这个网址:'/个人资料',templateUrl: 'public/msStream/views/setting/ProfileBody.html'})
同样非常重要的注意事项 - 父级必须为其子级包含锚点/目标/ui-view:
public/msStream/stateFiles/stateHome.html
<h2>这是家</h2>儿童占位符:<小时/><div ui-view=""></div>
这里最重要的是 <div ui-view=""></div>
- 子视图的占位符(未命名)>
在操作中检查它此处
I am using ui-router
and state provider to route the pages in my application. I have following states written in state provider.
.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'
})
When I am in home
state. /home
is added in my URL, but when I switch to home.profile
state using $state.go("home.profile)
, my URL is not changing to /home/profile
but HTML page added in templateurl
of the same state is getting rendered on front.
I tried adding /profile
and /home/profile
in the URL of the state but nothing seems to work. What am I missing here?
I created working plunker here
The paren-child states do inherit a lot. Among other things, also the url
. So we should not use for child the url part coming from parent.
$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'
})
Also very improtant note - parent must contain anchor/target/ui-view for its child:
public/msStream/stateFiles/stateHome.html
<div>
<h2>this is the home</h2>
placeholder for child:
<hr />
<div ui-view=""></div>
</div>
The most important here is the <div ui-view=""></div>
- a placeholder for child view (unnamed)
Check it in action here
这篇关于即使状态改变,URL 也不会改变.`用户界面路由器`的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!