Загрузка данных перед загрузкой контроллеров и просмотров

Question

У меня здесь немного проблем.

У меня есть приложение AngularJS, которое подключается к API и позволяет пользователям входить в систему, регистрироваться и т. Д. Пользователь получает токен, который затем сохраняется в $ localStorage (через ngstorage).

$localStorage[JWT] = data.token; 

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

Я искал разные способы сделать это, но я не мог понять. Любые указатели оцениваются!

Спасибо.

Answer 1

Вы можете использовать модуль ngRoute по умолчанию для таких простых случаев.

Сначала вы настраиваете маршрут с помощью свойств разрешения по умолчанию. Здесь мы говорим, что решение должно содержать список фильмов.

app.config(function($routeProvider){ 
    $routeProvider.when('/',{ 
    templateUrl:'initial.html', 
    controller:'MainCtrl' 
    }) 
    .when('/two',{ 
    templateUrl: 'post.html', 
    controller: 'PostCtrl', 
    resolve: { 
     movieList: function($movies) { 
     return $movies.get(); 
     } 
    } 
    }) 
    .otherwise({ 
    redirectTo:'/' 
    }); 
}); 

Во-вторых, нас интересует подключение к критическим событиям угловой системы. Следовательно, для этого небольшого примера приложения мы хотим, чтобы отключить кнопки используется, чтобы вызвать изменение страницы, а также показать текст loading...когда начинается процесс изменения страницы ...

(app.js):

app.controller('MainCtrl', function($scope, $location) { 
    $scope.go = function() { 
    $location.path('/two'); 
    }; 

    $scope.$on('$routeChangeStart', function(evt){ 
    $scope.showLoading = true; 
    }); 

    $scope.showLoading = false; 

}); 

(initial.html):

<a href="#/two" class="btn btn-default" ng-disabled="showLoading">Go</a> 
<br> 
<p ng-if="showLoading" style="color:red">Loading...</p> 

Весь код here

Дополнительная информация о ngRoute