用ui路由器公开当前状态名称
我试图实现一个语言切换器，如果用户从“en”端的任何给定页面点击“de”，它将把它们带到“de”端的那个页面。 如果我console.dir $状态参数，它暴露了我想要的值与给定的$状态的“当前”属性。 如果我尝试console.dir $ state.current专注于我想要的值，它只会给父状态属性（我当前视图嵌套）。
我目前的想法是，我在URL / EN /内容，dynamic我可以让我的郎导航dynamic地加载到适当的目的地点的某种数据属性，挑选那些自定义指令，我会发起一个“去”并设置我的首选angular度翻译的语言价值。
现在的关键问题是暴露$状态名称 – 再次，当浏览$状态当前对象给出我想要的值，但$ current.state直接只给父状态。
如果任何人有一个更好的build议，如何做到这一点（有针对性的 – 没有定制cookies垃圾），我很乐意采取build议。
谢谢！
更新！ 代码样本：
我的状态的对象引用：
var urlStates = { en: { home: { name: 'home', url: '/en', templateUrl: 'templates/'+lang+'/home.html', abstract: 'true' }, home_highlights: { name:'home.highlights', url: '', templateUrl: 'templates/'+lang+'/home.highlights.html' }, home_social: { name: 'home.social', url: '/social', templateUrl: 'templates/'+lang+'/home.social.html' }, home_map: { name: 'home.map', url: '/map', templateUrl: 'templates/'+lang+'/home.map.html' } }; 我的国家：
$stateProvider .state(urlStates.en.home) .state(urlStates.en.home_highlights) .state(urlStates.en.home_social) .state(urlStates.en.home_map); $locationProvider.html5Mode(true); })
控制器：
.controller('LandingPage', function($translate, $state){ this.state = $state; this.greeting = "Hello"; });
最后，我在dom中看到的结果是：
有了这个状态= $状态;
{ "params": {}, "current": { "name": "home.highlights", "url": "", "templateUrl": "templates/en/home.highlights.html" }, "transition": null }
使用this.state = $ state.current
{ "name": "", "url": "^", "views": null, "abstract": true }
这是我如何做到的
JAVASCRIPT：
var module = angular.module('yourModuleName', ['ui.router']); module.run( ['$rootScope', '$state', '$stateParams', function ($rootScope, $state, $stateParams) { $rootScope.$state = $state; $rootScope.$stateParams = $stateParams; } ]);
HTML：
<pre id="uiRouterInfo"> $state = {{$state.current.name}} $stateParams = {{$stateParams}} $state full url = {{ $state.$current.url.source }} </pre>
例
以这种格式回答你的问题是相当具有挑战性的。
另一方面，你问导航，然后关于目前的$state行事都怪异。
对于第一个我会说这是太宽泛的问题，第二我会说…呃，你做错了什么或错过显而易见的:)
拿下面的控制器：
app.controller('MainCtrl', function($scope, $state) { $scope.state = $state; });
哪里的app被configuration为：
app.config(function($stateProvider) { $stateProvider .state('main', { url: '/main', templateUrl: 'main.html', controller: 'MainCtrl' }) .state('main.thiscontent', { url: '/thiscontent', templateUrl: 'this.html', controller: 'ThisCtrl' }) .state('main.thatcontent', { url: '/thatcontent', templateUrl: 'that.html' }); });
那么简单的HTML模板就有了
<div> {{ state | json }} </div>
会“打印出”如下
{ "params": {}, "current": { "url": "/thatcontent", "templateUrl": "that.html", "name": "main.thatcontent" }, "transition": null }
我举了一个小例子，使用ui.router和pascalprecht.translate显示菜单。 我希望你觉得它有用，并弄清楚你做错了什么。
Plunker在这里http://plnkr.co/edit/XIW4ZE
撷取画面
在我目前的项目中，解决scheme如下所示：
我创build了一个抽象的语言状态
$stateProvider.state('language', { abstract: true, url: '/:language', template: '<div ui-view class="lang-{{language}}"></div>' });
项目中的每个州都必须依赖这个状态
$stateProvider.state('language.dashboard', { url: '/dashboard' //.... });
语言切换button调用一个自定义函数：
<a ng-click="footer.setLanguage('de')">de</a>
而相应的function就像这样（当然是在一个控制器里面）：
this.setLanguage = function(lang) { FooterLog.log('switch to language', lang); $state.go($state.current, { language: lang }, { location: true, reload: true, inherit: true }).then(function() { FooterLog.log('transition successfull'); }); };
这工作，但有一个更好的解决scheme，只是改变从HTML的状态参数值：
<a ui-sref="{ language: 'de' }">de</a>
不幸的是，这不起作用，请参阅https://github.com/angular-ui/ui-router/issues/1031
使用超时
$timeout(function () { console.log($state.current, 'this is working fine'); }, 100);
我围绕$timeout包装$state ，它为我工作。
例如，
(function() { 'use strict'; angular .module('app') .controller('BodyController', BodyController); BodyController.$inject = ['$state', '$timeout']; /* @ngInject */ function BodyController($state, $timeout) { $timeout(function(){ console.log($state.current); }); } })();
