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.
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'
})
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');
}
]);
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
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.