[英]how do return the $state.current.name from ui-router statechange
当我以角度改变位置时,我想返回.state('name')
。
从我的run()
它可以返回$state
对象:
.run(function($rootScope, Analytics, $location, $stateParams, $state) {
console.log($state);
但是当我尝试获取$state.current
它是空对象
.run(function($rootScope, $location, $stateParams, $state) {
console.log($state.current);
配置示例:
.config(function($stateProvider, $urlRouterProvider, AnalyticsProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('home', {
url: '/',
views: {
'': {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
},
'navigation@home': {
templateUrl: 'views/partials/navigation.html',
controller: 'NavigationCtrl'
},
'weekly@home': {
templateUrl: 'views/partials/weekly.html',
controller: 'WeeklyCtrl'
},
'sidepanel@home': {
templateUrl: 'views/partials/side-panel.html',
controller: 'SidePanelCtrl'
},
'shoppanel@home': {
templateUrl: 'views/partials/shop-panel.html',
controller: 'ShopPanelCtrl'
},
'footer@home': {
templateUrl: 'views/partials/footer.html',
controller: 'FooterCtrl'
}
}
})
您可以监听'$ stateChangeSuccess'并按位置设置状态。 例如 -
$rootScope.$on('$stateChangeSuccess',
function(event, toState, toParams, fromState, fromParams) {
$state.current = toState;
}
)
作为Sandeep解决方案的替代方案,您也可以这样做:
angular.module('yourApp').run(['$rootScope', '$state',
function ($rootScope, $state) {
$rootScope.$state = $state;
}
]);
这样做,它只被设置一次而不是每个 stateChange。 基本上你只是存储一个$ state的引用 - 我选择$ rootScope只是为了让这个例子保持简单。
现在在我的代码中,我可以很容易地引用它:
<div ng-show="$state.includes('accounting.dashboard')"></div>
和
<div>Current State: {{$state.current.name}}</div>
我也通常存储$ stateParams,所以我有更多关于状态的信息(但我把它留在了这个例子中)。
你也可以试试。
.controller('yourApp', function($scope,$state) {
$scope.state = $state;
现在您可以在控制台中记录它。
console.log($state);
它应该返回您当前的状态。
或者您可以像这样在html视图中调用范围。
{{state.current.name}}
它也将返回你所处的州。
如果你想在控制器中控制你的状态,你应该这样控制:
console.log($state.current.name);
如果你想在视图中控制它,那么:
在控制器中:
$scope.state = $state.current.name;
在模板:打印像那样
{{state}}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.