AngularJS：用404頁網址替換templateURL數據時未加載

Question

這並不當然的工作，但應該解釋我想達到的目標：

在工廠「myapp.factory（‘gameService’，函數（$ http，$ location）{「我從json feed加載數據 」返回$ http.jsonp（'api/game /'+ id +'？callback = JSON_CALLBACK'）「，如果數據未加載，則更改templateURL ，這是裝在第一，404頁網址，而不是

var get_data = function (id) { 
    return $http.jsonp('api/game/' + id + '?callback=JSON_CALLBACK') 
      .then(function(response) { 
       //data loaded, do magic 
      }, function(response) { 
       //data not loaded 
       templateUrl: 'views/page_not_found.html'; //<- how to inject this so it works? 
      }); 
}; 

Answer 1

與NG-開關和固定它NG-包括

在控制器中，當不加載數據I中添加：

$scope.page_not_found = true; 

而到了模板我添加：

<div ng-switch on="page_not_found"> 
    <div ng-if="page_not_found" ng-include="'views/page_not_found.html'"></div> 
</div> 

它並不真正代替templateURL，所有事情都發生在一個.html模板中。我隱藏了主要內容並使用ng-include導入了404頁面，這個解決方案似乎也更快。

Answer 2

要做到這一點，最好的辦法就是讓在路線提供商狀態設置爲「找不到網頁」，像這樣：

app.config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
     templateUrl: 'views/main.html' 
     controller: 'MainCtrl', 
     }) 
     .when('/pageNotFound', { 
     templateUrl: 'views/page_not_found.html' 
     }); 
}); 

，並在你的函數使這個：

var get_data = function (id) { 
    return $http.jsonp('api/game/' + id + '?callback=JSON_CALLBACK') 
     .then(function(response) { 
      //data loaded, do magic 
     }, function(response) { 
      //data not loaded 
      window.location = '/#/pageNotFound'; 
     }); 

};