admin管理员组文章数量:1327095
In my app I use angular UI-Router.
I have locals (English and Hebrew) My base language is English.
Thats why i want if the language is English not to add the parameter to the url
For example:
- Home English -->
/
Home Hebrew -->
/
About us English -->
- About us Hebrew -->
Is this possible ?
This is my current code
$stateProvider
.state('/', {
url: "/",
templateUrl: "Assets/app/templates/home.html",
controller: 'homeController'
})
.state('activity', {
url: "/activity",
templateUrl: "Assets/app/templates/gallery.html",
controller: 'galleryController'
})
.state('page', {
url: '/:pagename',
templateUrl: "Assets/app/templates/page.html",
controller: 'pageController'
});
In my app I use angular UI-Router.
I have locals (English and Hebrew) My base language is English.
Thats why i want if the language is English not to add the parameter to the url
For example:
- Home English -->
http://example./
Home Hebrew -->
http://example./he/
About us English -->
http://example./about
- About us Hebrew -->
http://example./he/about
Is this possible ?
This is my current code
$stateProvider
.state('/', {
url: "/",
templateUrl: "Assets/app/templates/home.html",
controller: 'homeController'
})
.state('activity', {
url: "/activity",
templateUrl: "Assets/app/templates/gallery.html",
controller: 'galleryController'
})
.state('page', {
url: '/:pagename',
templateUrl: "Assets/app/templates/page.html",
controller: 'pageController'
});
Share
Improve this question
edited Jul 17, 2015 at 7:17
Radim Köhler
124k48 gold badges242 silver badges340 bronze badges
asked Jul 16, 2015 at 16:09
24sharon24sharon
1,97510 gold badges45 silver badges70 bronze badges
1 Answer
Reset to default 10There is a working plunker
As always, that is feasible with UI-Router
- built in features. Firstly, we'd introduce the super parent state called for example 'root'. It would have defined parameter lang
.state('root', {
url: '/{lang:(?:en|he|cs)}',
abstract: true,
template: '<div ui-view=""></div>',
params: {lang : { squash : true, value: 'en' }}
})
Interesting things to mention: The url
uses regexp to reduce amount of matching lang words (in our case, English, Hebrew and Czech) :
url: '/{lang:(?:en|he|cs)}',
Read more e.g. here.
Also, we do profit from a setting called params : {}
. It says, that the default value is 'en'
and what is more important - it should be squashed, skipped if there is a match with 'en' param value:
params: {lang : { squash : true, value: 'en' }}
Read more e.g. here or here
So, this is our parent, root state, which we just would apply to all states with a state definition setting parent : 'root'
:
.state('home', {
parent: 'root', // parent will do the magic
url: "/",
templateUrl: "Assets/app/templates/home.html",
controller: 'homeController'
})
.state('activity', {
parent: 'root', // parent magic
url: "/activity",
templateUrl: "Assets/app/templates/gallery.html",
controller: 'galleryController'
})
.state('page', {
parent: 'root', // magic
url: '/page/:pagename',
templateUrl: "Assets/app/templates/page.html",
controller: 'pageController'
});
And now these links would work:
ui-sref English:
<a ui-sref="home({lang: 'en'})">home({lang: 'en'})</a>
<a ui-sref="activity({lang: 'en'})">activity({lang: 'en'})</a>
<a ui-sref="page({pagename:'one', lang: 'en'})">page({pagename:'one', lang: 'en'})</a>
ui-sref Hebrew:
<a ui-sref="home({lang: 'he'})">home({lang: 'he'})</a>
<a ui-sref="activity({lang: 'he'})">activity({lang: 'he'})</a>
<a ui-sref="page({pagename:'two', lang: 'he'})">page({pagename:'two'})</a>
href English:
<a href="#/">#/</a>
<a href="#/activity">#/activity</a>
<a href="#/page/three">#/page/three</a>
href Hebrew:
<a href="#/he/">#/he/</a>
<a href="#/he/activity">#/he/activity</a>
<a href="#/he/page/three">#/he/page/three</a>
Check it in action here
本文标签: javascriptAngular jsrouteui add default parmeterStack Overflow
版权声明:本文标题:javascript - Angular js - route-ui add default parmeter - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742207932a2433166.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论