Chargement du spinner sur routechangestart avec la bibliothèque d'authentification

Question

J'utilise la bibliothèque angulaire Hot Towel (https://github.com/johnpapa/hottowel-angular-bower) sur un projet dont j'ai hérité d'un développeur senior.

J'intègre également la bibliothèque d'authentification d'Auth0 pour Angular.

Je dois restreindre certaines routes aux utilisateurs authentifiés.Pour ce faire, j'ai défini certaines propriétés de route.
isLogin: true pour les itinéraires réservés aux utilisateurs non authentifiés.
requiresLogin: true pour les itinéraires nécessitant une authentification, et inversement pour ceux qui n'en ont pas besoin.Afin de vérifier ces propriétés à chaque exécution, j'utilise $rootScope.$on('$routeChangeStart' function()).

app.run(function ($rootScope, $location, auth, common, config) {
    var getLogFn = common.logger.getLogFn,
        log      = getLogFn('auth handle'),
        events   = config.events;

    $rootScope.$on('$routeChangeSuccess', function (e, nextRoute, currentRoute) {
        if (nextRoute.$$route && nextRoute.$$route.settings && nextRoute.$$route.settings.requiresLogin) {
            if (!auth.isAuthenticated) {
                $location.path('/login');
                log('User not authenticated');
            }
        }
        if (nextRoute.$$route && nextRoute.$$route.settings && nextRoute.$$route.settings.isLogin) {
            if (auth.isAuthenticated) {
                $location.path('/');
                log('User is authenticated');
            }
        }
    })
});

Maintenant, il semble que cela interfère avec la fonctionnalité de rotation incluse avec Hot-Towel.Dans Shell.js, je trouve ce qui suit :

$rootScope.$on('$routeChangeStart',
    function (event, next, current) { toggleSpinner(true); }
);

$rootScope.$on(events.controllerActivateSuccess,
    function (data) { toggleSpinner(false); }
);

$rootScope.$on(events.spinnerToggle,
    function (data) { toggleSpinner(data.show); }
);

Ce qui se passe, c'est que la roulette ne s'arrête jamais de tourner (par ex.vm.isBusy = true car un contrôleur n'est jamais activé et réinitialisé), comment puis-je contourner ce problème ?

Answer 1

Une idée est que vous pouvez utiliser un événement ($broadcast) pour avertir lorsqu'un accès non autorisé est effectué afin qu'il soit ensuite reçu par le contrôleur qui éteint le spinner.

Answer 2

Je n'ai pas étudié votre code depuis très longtemps mais ne devriez-vous pas l'utiliser $routeChangeSuccess arrêter le spinner ?

$scope.isViewLoading = false;
$scope.$on('$routeChangeStart', function() {
    $scope.isViewLoading = true;
});
$scope.$on('$routeChangeSuccess', function() {
    $scope.isViewLoading = false;
});