在我的应用程序中,我使用角度UI路由器.
我有当地人(英语和希伯来语)
我的基础语言是英语.
这就是为什么我想要的语言是英语不要将参数添加到网址
例如:
>主页英语 – > http://example.com/
> Home Hebrew – > http://example.com/he/
>关于我们English – > http://example.com/about
>关于我们希伯来语 – > http://example.com/he/about
这可能吗 ?
这是我目前的代码
$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' });
解决方法
有
a working plunker
与往常一样,UI-Router内置功能也是可行的.首先,我们将介绍称为“root”的超级父状态.它会定义参数lang
.state('root',{ url: '/{lang:(?:en|he|cs)}',abstract: true,template: '<div ui-view=""></div>',params: {lang : { squash : true,value: 'en' }} })
有趣的事情要提到:网址使用正则表达式来减少匹配语言的数量(在我们的例子中,英语,希伯来语和捷克语):
url: '/{lang:(?:en|he|cs)}',
此外,我们从一个名为params的设置中获利:{}.它说,默认值是’en’,更重要的是 – 它应该被压扁,如果与’en’param值匹配则跳过:
params: {lang : { squash : true,value: 'en' }}
所以,这是我们的父,root状态,我们只是将其应用于状态定义设置为parent的所有状态:’root’:
.state('home',{ parent: 'root',// parent will do the magic url: "/",controller: 'homeController' }) .state('activity',// parent magic url: "/activity",controller: 'galleryController' }) .state('page',// magic url: '/page/:pagename',controller: 'pageController' });
现在这些链接可以工作:
ui-sref英文:
<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希伯来语:
<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英文:
<a href="#/">#/</a> <a href="#/activity">#/activity</a> <a href="#/page/three">#/page/three</a>
href希伯来语:
<a href="#/he/">#/he/</a> <a href="#/he/activity">#/he/activity</a> <a href="#/he/page/three">#/he/page/three</a>