I'm looking for a way to load ng-templates from a bundled html file to use as src in ng-include.
I found a demo that exactly suited me needs, and is working fine in AngularJS 1.6.1. Unfortunately in the newer versions 1.7 and higher it no longer works.
var app = angular.module("test", []);
app.factory("$templateCache", function($cacheFactory, $http, $injector) {
var cache = $cacheFactory("templates");
var allTplPromise;
return {
get: function(url) {
var fromCache = cache.get(url);
if (fromCache) {
return fromCache;
}
if (!allTplPromise) {
allTplPromise = $http
.get("all-templates.html")
.then(function(response) {
$injector.get("$compile")(response.data);
console.log(response.data);
return response;
});
}
return allTplPromise.then(function(response) {
var result = {
status: response.status,
data: cache.get(url),
headers: response.headers
};
return result;
});
},
put: function(key, value) {
cache.put(key, value);
}
};
});<!DOCTYPE html>
<html ng-app="test">
<head>
<title>Loading all templates in one file...</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js"></script>
</head>
<body>
<div ng-include="'/one'">Not working...</div>
<div ng-include="'/two'">Not working...</div>
</body>
</html>- What has changed in version 1.7 which causes the problem?
- How can I fix it?
- Is there a better alternative?