AngularJS $ location.path не перенаправляется

Question

Я искал решение, но я до сих пор не могу получить $location.path() для правильной работы.

Дело простое: после положительной аутентификации я пытаюсь вернуться к корневому адресу: /#/. Путь в адресной строке меняется, но страницы нет. Что любопытно, когда я нажимаю «Enter» в адресной строке, страница перезагружается, прежде чем перейти к корневому адресу. И что более любопытно, Мне нужно нажать enter несколько раз, прежде чем он действительно перенаправит меня на другую страницу. Это странно, потому что это не так, как предполагается, что «одностраничный» подход работает.

Я использую Angular Router, а остальная часть страницы работает правильно. Каждый экран загружается плавно после ввода его пути и нажатия «Enter» - без перезагрузки. Единственная проблема заключается в шаге аутентификации.

Когда приложение загружается с первого раза, а страница /login выдается, поскольку данные аутентификации не сохранены, приложение может быть перенаправлено на корневой адрес после положительной проверки подлинности (но не всегда). Но когда данные аутентификации теряются во время работы приложения и пользователь перенаправляется на страницу /login, приложение просто не может вернуться к корневому URL.

Я создал блок-схему, в которой представлены способы изменения маршрутов. Зеленая область представляет первый случай, когда пользователь открывает приложение и еще не вошел в систему. Область чтения представляет второй случай, когда пользователь по какой-либо причине теряет данные аутентификации (например, старый токен, сменил пароль из другого источника). Пользователь перенаправляется на страницу /login, а затем после положительной проверки подлинности не может вернуться к корневому URL.

Я пытался обернуть $location.path('/') в $scope.$apply, но получил сообщение об ошибке, что дайджест на самом деле продолжаются. Обернуть его в $timeout тоже не помогло. Я могу, конечно, перезагрузить страницу после изменения пути, но это создает уродливый эффект исчезающего интерфейса.

Ниже приведен код после нажатия кнопки «Вход».

function doLogin() { 
    vm.loginInProgress = true; 

    LoginService.login(vm.username, vm.password).then(function() { 
     $location.path('/'); 
    }).catch(function() { 
     var confirm = $mdDialog.confirm() 
      .title('Authentication error') 
      .textContent('Username and/or password is invalid.') 
      .ariaLabel('Authentication error') 
      .ok('OK') 
      .cancel('Forgotten password?'); 

     $mdDialog.show(confirm).catch(function() { 
      //TODO: Forgotten password 
     }) 
    }).finally(function() { 
     vm.loginInProgress = false; 
    }); 
} 

Маршруты:

$routeProvider 
    .when('/login', { 
     templateUrl: 'views/login.html', 
     controller: 'LoginController', 
     controllerAs: 'vm' 
    }) 
    .when('/', { 
     templateUrl: 'views/home.html', 
     controller: 'HomeController', 
     controllerAs: 'vm', 
     resolve: { 
      init: init 
     } 
    }); 

/* @ngInject */ 
function init(ConfigService, TemperatureService) { 
var ret = {}; 

return ConfigService.finished() 
    .then(function() { 
     return TemperatureService.getSetPoint(); 
    }) 
    .then(function (data) { 
     ret['setpoint'] = data; 
     return TemperatureService.getWorkModes(); 
    }) 
    .then(function (data) { 
     ret['workmodes'] = data; 
     return ret; 
    }); 
} 

Это выглядит как странное поведение location.path метода. Или я просто что-то пропустил. Каждая помощь будет оценена по достоинству.

Answer 1

В своем вопросе вы приняли resolve, который выполняет код, указанный в этой функции Resolve.

У вас должна быть проблема с этой функцией init, которую вы использовали для разрешения.

$routeProvider 
    .when('/login', { 
     templateUrl: 'views/login.html', 
     controller: 'LoginController', 
     controllerAs: 'vm' 
    }) 
    .when('/', { 
     templateUrl: 'views/home.html', 
     controller: 'HomeController', 
     controllerAs: 'vm', 
     resolve: { 
      init: init 
     } 
    }); 

Ваш INIT может пойти сюда,

var init = function ($q, $rootScope, $location) { 
    if ($rootScope.login) { 
     return true; 
    } else { 
     $location.path('/login') // this is a sample 
    } 
}; 

Вы можете иметь некоторые проблемы в этом методе. проверьте один раз.

Answer 2

Возможно, это связано с функцией разрешения init по маршруту /, который не разрешен правильно.

Вы можете попробовать прослушать $routeChangeError, чтобы узнать, что случилось.

$rootScope.$on('$routeChangeError', function() { 
    ... 
});