[英]Angular - Bootstrap: Page navigation (Next and back button) using Angular UI-route not working when changing the state from controller
我正在尝试使用Angular UI-route实现页面导航(“下一步”和“后退”按钮)。 我正在从控制器更改状态,它也在视图中更改,但没有将我重定向到该页面。 我已经使用$ state.go('stateName')通过单击按钮实现了,但是我想为此使用Bootstrap页面。
这是我的代码
$stateProvider .state('settings', { url: '/settings', templateUrl: 'templates/settings.html' }) .state('settings.profile', { url: '/profile', templateUrl: 'templates/profile.html', controller: 'ProfileController' }) .state('settings.account', { url: '/account', templateUrl: 'templates/account.html', controller: 'AccountController' }) .state('settings.profile1', { url: '/profile1', template: 'settings.profile1' }) .state('settings.account1', { url: '/account1', template: 'settings.account1' }); $urlRouterProvider.otherwise('/settings/profile'); // controlller $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) { $scope.nextState = 'settings.account'; $scope.previousState = $state.current; //alert('$stateChangeStart') });
<ul class="pager"> {{nextState}} <li><a ui-sref=".{{previousState}}">Previous</a></li> <li><a ng-click=".{{nextState}}">Next</a></li> </ul>
这是我观察到的,如果您将ui-sref与某个范围变量一起使用,则第一次它可以正常工作并生成与状态相关的href。 但是,当范围变量更改href不变时,可能是一个问题。
不知道为什么$ stateChangeSuccess无法正常工作。 我正在处理rootScope的状态,但是您可以移动此代码SettingsController。
example.run(function($rootScope, $state){
var arrState = [];
var states = $state.stateRegistry.states;
angular.forEach(states, function(key, value) {
if (value !== "") {
arrState.push(value)
}
});
$rootScope.$on('$locationChangeSuccess', function(){
var n = !$state.current.name ? 1 : arrState.indexOf($state.current.name) + 1;
$rootScope.next = arrState[n];
var p = !$state.current.name ? 0 : arrState.indexOf($state.current.name) - 1;
if (p <0 ) p = 0;
$rootScope.previous = arrState[p];
});
$rootScope.goNext = function () {
$state.go($rootScope.next);
}
$rootScope.goPrevious = function () {
$state.go($rootScope.previous);
};
});
通过ng-click使用goNext和goPrevious。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.