Redirection vers la page d'erreur dans Angularjs

Je suis nouveau à AngularJs. J'ai une application d'une seule page avec des routes configurées ayant un contrôleur et une vue. La vue chargés à l'intérieur de l' <ng-view></ng-view> element index.html page. À l'intérieur du contrôleur je fais un http appel pour obtenir les données et de liaison de données à $scope. Pour les scénarios de succès cela fonctionne très bien, mais s'il y a une erreur, Comment puis-je brancher une autre vue au lieu de la vue par défaut configurée à l'intérieur de la route angulaire. S'il vous plaît laissez-moi savoir.

12
demandé sur zilcuanu 2014-07-08 11:04:26

4 réponses

Utiliser $location.url() pour rediriger vers un 404.html lorsque l'erreur est survenue

$http.get(url,[params])
    .success(function(data, status, headers, config){
        // bind your data to scope
    })
    .error(function(data, status, headers, config) {
        $location.url('/404');
    });

alors configurez votre $routeProvider

$routeProvider
    .when('/404', {
        templateUrl: '404.html',
        controller: 'Four04Controller'
    })
17
répondu Raghavendra 2014-07-08 07:11:07

pour mettre en œuvre un scénario commun pour le traitement des erreurs ajax, vous pouvez mettre en œuvre custom request interceptor et rediriger l'utilisateur vers la page d'erreur (ou la page de connexion) selon le statut d'erreur:

myApp.factory('httpErrorResponseInterceptor', ['$q', '$location',
  function($q, $location) {
    return {
      response: function(responseData) {
        return responseData;
      },
      responseError: function error(response) {
        switch (response.status) {
          case 401:
            $location.path('/login');
            break;
          case 404:
            $location.path('/404');
            break;
          default:
            $location.path('/error');
        }

        return $q.reject(response);
      }
    };
  }
]);

//Http Intercpetor to check auth failures for xhr requests
myApp.config(['$httpProvider',
  function($httpProvider) {
    $httpProvider.interceptors.push('httpErrorResponseInterceptor');
  }
]);

Plunker ici

31
répondu Yuriy Rozhovetskiy 2014-07-08 08:25:06

vous pouvez utiliser: https://github.com/angular-ui/ui-router En cas d'erreur, vous pouvez déclencher une "erreur" de l'état. J'ai eu le même problème il y a quelques semaines et j'ai résolu de cette façon

3
répondu chf 2014-07-08 07:08:42

Si vous utilisez $stateProvider au lieu de $routeProvider tu peux faire comme ceci:

function routerConfig($stateProvider, $urlRouterProvider) {
  $stateProvider
     .state('404', {
       url: '/404',
       templateUrl: '404.html'
     })
     .state('home', {
       url: '/',
       templateUrl: 'home.html'
     });

  $urlRouterProvider.otherwise('/404');
}

faites attention à $ urlRouterProvider.dans le cas contraire(url), qui est la fonction qui est appelée lorsque le fournisseur ne trouve pas l'url demandée, de sorte qu'il rediriger automatiquement vers l'url fournie dans cette fonction.

0
répondu luizfelippe 2016-12-12 05:30:39