Góc: xử lý lỗi $ http 404

Question

tôi có HTML với 2 ng-include. Hãy xem xét nếu một trong những ng-bao gồm src không có mặt trong máy chủ. tính đến bây giờ nó sẽ chỉ tải html trống và trong giao diện điều khiển trình duyệt nó sẽ nói http-404 tập tin không tìm thấy. Vì vậy, trong trường hợp này, tôi muốn tải một trang Lỗi mặc định (chỉ có trong máy chủ) vào div cụ thể đó, tức là một nửa hiển thị Trang Lỗi Mặc định và một trang khác có div thích hợp được tải qua nginclude.

Logic của tôi, đang sử dụng trình chặn chặn http, nơi tôi chặn tất cả các cuộc gọi http.khi có 404 xảy ra, tôi muốn trả lại trang Lỗi mặc định chỉ được tải vào div. do đó, nó giống như chế nhạo một cuộc gọi http chính xác nhưng thay vào đó gửi một trang lỗi, mà tôi giả định phải được tải vào div thích hợp.

Nhưng điều này không vui vẻ :). Tôi đã thử với window.load ('') mặc định. Nhưng sau đó nó tải trên đầu trang và có mặt trên các trang.

Hoặc tôi có nên chụp id div (nếu có cách nào không?) Và sau đó thực hiện tải id ID mặc định?

Cần suy nghĩ của bạn về điều này.

Answer 1

Để xử lý loại tình huống này, bạn có thể sử dụng bộ chặn http (tìm tài liệu ở đây: $http).

Interceptor có để bắt phản ứng 404, tải trang 404.html từ máy chủ của bạn và thiết lập nó như là một dữ liệu cho các phản ứng ban đầu cùng với tình trạng đang 200.

Tôi đã đã tạo ra một dự án cho thấy cách giải quyết nó.

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

Hãy xem xét kỹ hơn các tập tin main.js.

Answer 2

Tôi đã làm điều tương tự bằng cách chuyển url ng-bao gồm mong muốn thông qua $ http trực tiếp trước khi điền giá trị ng-bao gồm.

$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; 
    }); 

Bí quyết ở đây là đi qua $ templateCache trong như là đối số bộ nhớ cache để $ http - điều này có nghĩa là url lấy được lưu trữ trong bộ nhớ cache tương tự mà ng-bao gồm sử dụng, và vì vậy khi bạn tìm thấy một mẫu hợp lệ và đặt nó trong thuộc tính templateUrl, ng-include không cần lấy lại mẫu.