All geek questions in one place

The angular directive templateUrl returns 400, although it loads the file URL

I have a basic directive on an MVC 5 layout page with a search directive. My problem is that templateUrl could not be loaded (error 400). If I enter the URL directly into the browser, I can load the html page without difficulty or error. I cannot understand why the AJAX call to load the page does not work.

Chrome debugger Chrome debugger

This is loading an HTML page in Chrome

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

base-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>

EDIT Here is a successful request (via browser): Good request

and here is the one that fails (via the Angular directive): Bad request

+6
source share
2 answers

I solved it. It seems that someone added the following to the module configuration: an attempt to resolve an IE error (surprise, surprise):

 //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";

I deleted it, cleared my cache, and it works great.

+3
source

The IE error referenced by Chris is a caching error that allows reloading old content when using angular $ http and IE.

I wrote about the subject here: http://benjii.me/2014/07/ie-is-caching-my-angular-requests-to-asp-net-mvc/

A better solution than removing the error correction code is to fix it. Use the following instead:

 //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";
+3
source

Source: https://habr.com/ru/post/982229/

More articles:


All Articles