Trong ví dụ sau tôi đã tạo một decorator(chỉ chạy một lần cho mỗi ứng dụng ở giai đoạn cấu hình) và thêm một thuộc tính bổ sung cho $statedịch vụ, vì vậy cách tiếp cận này không thêm các biến toàn cục vào $rootscopevà không yêu cầu thêm bất kỳ phụ thuộc nào vào các dịch vụ khác ngoài $state.
Trong ví dụ của tôi, tôi cần chuyển hướng người dùng đến trang chỉ mục khi anh ta đã đăng nhập và khi anh ta không chuyển hướng anh ta đến trang "được bảo vệ" trước đó sau khi đăng nhập.
Các dịch vụ không xác định duy nhất (cho bạn) mà tôi sử dụng là authenticationFactoryvà appSettings:
authenticationFactorychỉ quản trị đăng nhập người dùng. Trong trường hợp này tôi chỉ sử dụng một phương pháp để xác định xem người dùng có đăng nhập hay không.appSettingslà hằng số chỉ để không sử dụng chuỗi ở khắp mọi nơi. appSettings.states.loginvà appSettings.states.registerchứa tên của tiểu bang cho url đăng nhập và đăng ký.
Sau đó, trong bất kỳ controller/ serviceetc bạn cần tiêm $statedịch vụ và bạn có thể truy cập url hiện tại và trước đó như thế này:
- Hiện hành:
$state.current.name
- Trước:
$state.previous.route.name
Từ bảng điều khiển Chrome:
var injector = angular.element(document.body).injector();
var $state = injector.get("$state");
$state.current.name;
$state.previous.route.name;
Thực hiện:
(Tôi đang sử dụng angular-ui-router v0.2.17và angularjs v1.4.9)
(function(angular) {
"use strict";
function $stateDecorator($delegate, $injector, $rootScope, appSettings) {
function decorated$State() {
var $state = $delegate;
$state.previous = undefined;
$rootScope.$on("$stateChangeSuccess", function (ev, to, toParams, from, fromParams) {
$state.previous = { route: from, routeParams: fromParams }
});
$rootScope.$on("$stateChangeStart", function (event, toState/*, toParams, fromState, fromParams*/) {
var authenticationFactory = $injector.get("authenticationFactory");
if ((toState.name === appSettings.states.login || toState.name === appSettings.states.register) && authenticationFactory.isUserLoggedIn()) {
event.preventDefault();
$state.go(appSettings.states.index);
}
});
return $state;
}
return decorated$State();
}
$stateDecorator.$inject = ["$delegate", "$injector", "$rootScope", "appSettings"];
angular
.module("app.core")
.decorator("$state", $stateDecorator);
})(angular);