Kątowe: obsługa błędów HTTP 404

Question

Mam kod HTML z 2 ng-zawiera. Zastanówmy się, czy jeden z src ng-include nie jest obecny na serwerze. od tej chwili wystarczy załadować pusty HTML i w konsoli przeglądarki nie można znaleźć pliku http-404.

Tak więc w tym przypadku chcę załadować stronę domyślnego błędu (która jest obecna na serwerze) tylko do tego konkretnego elementu div, tj. Połowa pokazuje domyślną stronę błędów i inną z odpowiednim div, który został załadowany za pomocą nginclude.

Moja logika polega na użyciu przechwytywacza http, w którym przechwytuję wszystkie wywołania http. Gdy tylko nastąpi 404, chcę zwrócić stronę domyślnego błędu, która musi być załadowana tylko do elementu div. więc jest to podobne do kpiny z prawidłowego wywołania http, ale zamiast tego wysyłania strony błędu, które zakładam musi być załadowany do właściwego div.

Ale to nie jest happeneing :). Próbowałem z domyślnym window.load (''). Ale potem ładuje się na górze strony i jest obecna na różnych stronach.

Czy powinienem przechwycić identyfikator div (jeśli tak, w jaki sposób?), A następnie czy id tat załaduje domyślny kod błędu HTML?

Potrzebujesz swojej myśli w tym.

Answer 1

Aby poradzić sobie w takich sytuacjach, można użyć przystawek przechwytujących (zapoznaj się z dokumentami tutaj: $http).

Interceptor musi złapać odpowiedź 404, załadować stronę 404.html z serwera i ustawić go jako danych dla początkowej reakcji wraz ze statusem kodu 200.

mam stworzył projekt, który pokazuje, jak go rozwiązać.

Repozytorium: https://github.com/matys84pl/angularjs-nginclude-handling-404/

Przyjrzyj się plikowi main.js.

Answer 2

Zrobiłem coś podobnego, przekazując pożądany adres URL ng-include przez $ http bezpośrednio przed wypełnieniem wartości ng-include.

$http({ url: url, method: "GET", cache: $templateCache}).success(function(data) { 
     /* there was a template for this url - set the $scope property that 
     * the ng-include is using 
     */ 
     $scope.templateUrl = url; 
    }).error(function() { 
     // there was not a template for this url - set the default one 
     $scope.templateUrl = defaultUrl; 
    }); 

Sztuką tutaj przechodzi $ templateCache jako argumentu cache $ http - oznacza to, że pobrane URL są przechowywane w tej samej pamięci podręcznej że ng obejmują zastosowania, a więc gdy znajdziesz poprawny szablon i ustawić go we właściwości templateUrl, ng-include nie musi ponownie pobierać szablonu.