Rendu 404 au lieu de rediriger 404 dans angularjs

Je suis à la recherche d'une bonne approche pour le rendu de la page 404 au lieu de rediriger la page d'erreur 404 en angularjs. De nombreuses solutions que j'ai trouvé est tout au sujet de la redirection vers une autre page. Il va créer un problème que si l'utilisateur clique sur le bouton précédente du navigateur, je vais créer un autre rediriger vers la page d'erreur 404. Donc, je suis à la recherche d'une solution qui rend la page 404 au lieu.

Merci pour la lecture, j'espère que c'est compréhensible pour vous les gars.

source d'informationauteur nXqd

  1. 13

    Utilisation de otherwise peut-être ce que vous cherchez.

    angular.module('MyApp', [])
.config(function($routeProvider) {
  $routeProvider.
    when('/', {templateUrl:'/home.html'}).
    //add as many as you want here...
    otherwise({templateUrl:'/404.html'}); //Render 404 view
});

    Mise à jour: Après avoir lu plus attentivement les OP question (désolé, très tôt par ici), je pense j'ai une autre solution (en fait deux):

    1) Un $scope variable à l'INTERFACE principale de votre ng-view qui cache le contenu

    Cela nécessite ng-show de votre point de vue et resolve dans vos paramètres, puis faites un $emit pour les autres contrôleurs pour dire "Hey, ce gars a frappé un 404, ne l'affichez pas votre point de vue"

    $routeProvider.otherwise({
  controller: 'masterController',
  resolve: {
    404: function(){
      return true;
    };
  });

angular.module('MyApp', [])
.controller('masterController', function($scope, 404) {
  $scope.isOn404 = 404
  ...
})

//In the view

<div ng-controller="masterController">
   <div ng-hide="isOn404">
    <!-- Actual content -->
   </div>
   <div ng-show="isOn404">
    <!-- 404 Page -->
   </div>
</div>

    Maintenant, cela nécessite que vous disposiez d'un contrôleur maître, qui vous aide à gérer le reste de votre INTERFACE utilisateur. Aussi, vous aurez très probablement besoin de faire un peu de codage pour le traitement du reste de la page, au lieu de simplement en utilisant ng-view (par exemple, certains contrôleurs qui montrent le courant de l'en-tête, corps, etc).

    2) Une coutume système de routage

    En fait, j'ai fait cela pour un projet spécifique: vous disposez d'un service qui met en place une "BackURL" et "FordwardURL"; chaque $onRouteChange vous magasin où allez-vous et d'où venez-vous; si l'utilisateur est sur le point de frapper une erreur 404, vous pouvez toujours rendre grâce à mon exemple d'origine, mais lorsque l'utilisateur appuie sur le dos, attraper que par AngularJS et de retourner le "Retour" de la page. Dans ce cas, je suis en utilisant une bibliothèque qui m'aide avec le service de routage sur des appareils mobiles appelés Lungo et une bibliothèque que l'entreprise pour laquelle je travaille utilise, le L. A. B (Lungo Angulaire Pont).

  2. 1

    Je suis nouveau sur AngularJS, si cela peut ne pas être une solution idéale, mais il fonctionne pour afficher une page d'erreur 404, ou pour des utilisations similaires, tels que une page de connexion:

    Voir Exemple De Travail

    Rediriger la sortie vers le même modèle master:

    $routeProvider
.when('/', {
        controller: 'homeController',
        templateUrl: 'partial.master.html'
    })
.when('/cust/:custid', {
        controller: 'custController',
        templateUrl: 'partial.master.html'
    })

    master.html modèle désigne le module optionnel mastercontroller et a une sous-page:

    <div ng-controller="masterController">
    <h2><a href="#">{{title}} - Header</a></h2>
    <hr>

    <div ng-include="subPage"></div>

    <hr>
    <h3>{{title}} - Footer</h3>
</div>

    module optionnel mastercontroller a conditionnelle sous-page de la logique:

    controllers.custController = function($scope, $rootScope, $routeParams){
    $rootScope.subpage = 'cust';
    $scope.cust = getCustomer( $routeParams.custid );
};
controllers.masterController = function($scope, $rootScope) {
    switch($rootScope.subpage) {
    case 'home':
        $scope.subPage = 'partial.home.html';
        break;
    case 'cust':
        if($scope.cust) {
            $scope.subPage = 'partial.cust.html';
        } else {
            $scope.subPage = 'partial.404notfound.html';
        }
        break;
  3. 0

    Vous pouvez également utiliser l'interface utilisateur-routeur comme déjà répondu ici: https://stackoverflow.com/a/23290818/2723184. À mon humble avis, vous obtenez non seulement une impressionnante bibliothèque, mais vous obtenez une meilleure solution.