Annuler l'itinéraire et rediriger vers un autre itinéraire sans afficher le contenu d'origine dans AngularJS

Je veux vérifier un http services pour voir si un utilisateur est authentifié et s'il a la permission de voir les certains de page (contrôleur) dans AngularJS 1.2.0rc1.

J'ai ce scénario:
L'utilisateur A veut visiter http://www.example.com/content. Maintenant, ce contenu ne doit pas être accessible quand il ou elle n'est pas authentifié. Si l'utilisateur n'est pas authentifié, ils devraient être redirigé vers http://www.example.com/login.

Maintenant j'ai réussi à le faire, mais je vois le rendu html de la page de contenu brièvement. Je ne veux pas de cela. Comment puis-je rediriger vers la page de connexion, sans rendre le contenu de la page?

- Je enregistrer mes parcours en tant que tel:

$routeProvider.when('/login', route.resolve('Login', false))
$routeProvider.when('/content', route.resolve('Content', true))

Maintenant, j'ai essayé ceci:

$rootScope.$on('$routeChangeStart', function (event, route) {
    if (route.requiresLogin) {
        $http.get('/api/user/loggedin/').then(function (response) {
            if (response !== 'true') {
                $location.path('/login');
            }
        });
    }
});

Qui fonctionne, mais je vois encore le contenu html de la page (contenu) clignote.

J'ai lu que ici que vous pouvez également essayer de changer la résolution de la fonctionnalité quand la route est résolu:

    var resolve = function (baseName, requiresLogin) {
    var routeDef = {};
    var dependencies = [routeConfig.getControllersDirectory() + baseName + 'Controller.js'];

    routeDef.templateUrl = routeConfig.getViewsDirectory() + baseName.toLowerCase() + '.html';
    routeDef.controller = baseName + 'Controller';
    routeDef.requiresLogin = requiresLogin;
    routeDef.resolve = {
        load: ['$q', '$rootScope', '$http', '$location', function ($q, $rootScope, $http, $location) {
            console.log(requiresLogin);
            if (requiresLogin) {
                return checkLoggedIn($q, $rootScope, $http, $location);
            } else {
                return resolveDependencies($q, $rootScope, dependencies);
            }
        }]
    };

    return routeDef;
}

Mais ici, la page est également affiché brièvement.

Espère que vous pourrez m'aider.

source d'informationauteur Aldentev | 2013-08-15

  1. 21

    La première réponse devrait fonctionner, mais le faire à l'aide $q je voudrais utiliser defer.resolve() ou defer.reject("rejection_reason") alors je voudrais écouter un $routeChangeError à un niveau supérieur contrôleur qui est lié à un élément en dehors de la ng-view que la routeProvider gère.

    Donc dans votre code HTML, quelque chose comme:

    <body ng-app="app" ng-controller="DocumentCtrl">
  <div ng-view>
  </div>
</body>

    Alors que la route de la vôtre serait être défini quelque chose comme:

    when('/home', {
  templateUrl: templateUrl blah,
  controller: baseName + 'Controller',
  resolve: {
    load: function($q, MY_USER_SERVICE){
      var defer = $q.defer();
      if(~MY USER LOGGED_IN LOGIC RETURNS TRUE~){
        defer.resolve();
      } else {
        defer.reject("not_logged_in");
      }
      return defer.promise;

    }
  }
}).

    Puis mon DocumentCtrl contrôleur contient:

    $scope.$on("$routeChangeError", function(evt,current,previous,rejection){
  if(rejection == "not_logged_in"){
    //DO SOMETHING
  } else {
    //OR DO SOMETHING ELSE
  }
});

    Je suis en cours d'exécution ci-dessus et il n'y a pas de flash de tout point de vue qui ne doit pas être chargé.