Angular: обработка ошибок HTTP http: 404

У меня есть HTML с 2 нг-включениями. Подумайте, нет ли одного из ng-include src на сервере. на данный момент он просто загрузит пустой html, а в консоли браузера скажет, что файл http-404 не найден.

Итак, в этом случае я хочу загрузить страницу ошибки по умолчанию (которая присутствует на сервере) только в этом конкретном div, т.е. половину отображения страницы ошибки по умолчанию и другую с соответствующим div, который был загружен через nginclude.

Моя логика: я использую http-перехватчик, где я перехватываю все http-вызовы. Когда бы ни происходило 404, я хочу вернуть страницу ошибки по умолчанию, которая должна быть загружена только в div. так что это вроде насмехается над правильным HTTP-вызовом, но вместо этого отправляет страницу с ошибкой, которая, как я полагаю, должна быть загружена в соответствующий div.

Но это не происходит:). Я попытался использовать default.load(''). Но затем он загружается поверх страницы и присутствует на разных страницах.

Или я должен захватить идентификатор div (если это так?), а затем сделать tat id загрузкой HTML-кода по умолчанию?

Нуждайтесь в этом.

Ответ 1

Чтобы справиться с такими ситуациями, вы можете использовать http-перехватчики (найти документы здесь: $http).

Перехватчик должен поймать ответ 404, загрузить страницу 404.html с вашего сервера и установите его как данные для начального ответа вместе со кодом состояния 200.

Я создал проект, который показывает, как его решить.

Репозиторий: https://github.com/matys84pl/angularjs-nginclude-handling-404/

Посмотрите более подробно на main.js файл.

Ответ 2

Я сделал что-то подобное, передав нужный URL-адрес ng-include через $http непосредственно перед заполнением значения 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;
    });

Трюк здесь передается $templateCache в качестве аргумента кэша в $http - это означает, что выбранный URL-адрес хранится в том же кеше, который использует ng-include, и поэтому, когда вы находите правильный шаблон и устанавливаете его в Свойство templateUrl, ng-include, не нужно снова извлекать шаблон.