AngularJS指令templateUrl通過文件URL加載返回400.

我在MVC 5佈局頁面中有一個基本指令，用於搜索指令。我的問題是，無法加載templateUrl（400錯誤）。如果我直接在瀏覽器中輸入URL，我可以毫無困難地加載html頁面。我找不到爲什麼AJAX調用加載頁面失敗。AngularJS指令templateUrl通過文件URL加載返回400.

鉻調試 Chrome debugger

這是Chrome的HTML頁面加載

Page loads

app.js

(function() { 
    var app = angular.module("mainApp"); 

    app.directive("basicSearch", function() { 
     return { 
      templateUrl: 'app/directives/basic-search.html', 
      controller: function($scope, search) { 
       $scope.keyword = ''; 
       $scope.exact = false; 
       $scope.submitSearch = function() { 
        search.searchByKeyword($scope.keyword, 0, $scope.exact); 
       } 
      } 
     } 
    }); 
}());

基本-search.html

<div> 
    <input type="search" ng-model="keyword" name="keyword" /> 
    <button type="submit" ng-click="submitSearch()"></button> 
    <input type="checkbox"ng-model="exact" name="exact" /> 
    <label for="exact">Exact Match?</label> 
</div>

_Layout.cshtml

<html> 
    <head> 
    <base href="@Request.ApplicationPath" /> 
    <!--- JS & CS References --> 
    <title></title> 
    </head> 
    <body ng-app="mainApp"> 
    <!-- Other stuff --> 
    <basic-search></basic-search> 
    <!-- More other stuff --> 
    @RenderBody() 
    </body> 
</html>

編輯這裏是成功的請求（通過瀏覽器）： Good Request

，這裏是失敗的人（通過Angular指令）： Bad Request

來源

2015-02-09 Chris Paton

比較兩種情況下的標頭，可能有差異。 – dfsq 2015-02-09 18:19:10

該模板位於要提供的靜態文件夾中？如果您無法通過瀏覽器中的url訪問普通模板，則角度不能太... – 2015-02-09 18:25:42

我可以訪問它。請參閱**網址加載**部分。 – 2015-02-09 18:28:32

我解決了它。看來有人添加了以下的模塊配置爲試圖解決一個IE漏洞（驚奇，驚奇）：

//initialize get if not there 
if (!$httpProvider.defaults.headers.get) { 
    $httpProvider.defaults.headers.get = {}; 
} 

//disable IE ajax request caching 
$httpProvider.defaults.headers.get["If-Modified-Since"] = "0";

我刪除它，清除了我的緩存，它的正常工作。

來源

2015-02-11 12:23:08

Chris提到的IE錯誤是一個緩存錯誤，允許在使用angular的$ http和IE時重新提供舊內容。

我寫這個話題在這裏：http://benjii.me/2014/07/ie-is-caching-my-angular-requests-to-asp-net-mvc/

不是刪除的bug修復代碼更好的解決方法是修復它。改爲使用以下內容：

//initialize get if not there 
if (!$httpProvider.defaults.headers.get) { 
    $httpProvider.defaults.headers.get = {}; 
} 

//disable IE ajax request caching 
$httpProvider.defaults.headers.get["If-Modified-Since"] = "Fri, 01 Jan 2010 00:00:00 GMT";

來源

2015-05-03 14:25:09

AngularJS指令templateUrl通過文件URL加載返回400.

回答

相關問題