2016-01-12 55 views
2

我使用的Angular UI Bootstrap v1.0.3包含模板(我选择了包含模板,我可以在源代码中看到* tpls模块),但是当我打开这样的模式时从内部app.run(...)):Angular UI Bootstrap:不加载模板

var type = "sometype"; 
$uibModal.open({ 
    templateUrl: "/partials/" + type + "-dialog.html", 
}); 

我得到一个错误:

angular.min.js:93 GET http://.../uib/template/modal/backdrop.html?sessionid=363192 404 (Not Found)(anonymous function) @ angular.min.js:93r @ angular.min.js:89g @ angular.min.js:86(anonymous function) @ angular.min.js:119r.$eval @ angular.min.js:133r.$digest @ angular.min.js:130r.$apply @ angular.min.js:134g @ angular.min.js:87T @ angular.min.js:92w.onload @ angular.min.js:93 angular.min.js:107 

Error: [$compile:tpload] http://errors.angularjs.org/1.4.8/$compile/tpload?p0=uib%2Ftemplate%2Fmodal%2Fbackdrop.html&p1=404&p2=Not%20Found at Error (native) 

我尝试手动添加模板,我的代码和下面的代码添加到我的app.js的顶部:

angular.module("template/modal/backdrop.html", []).run(["$templateCache", function($templateCache) { 
    $templateCache.put("template/modal/backdrop.html", "<div class=\"modal-backdrop\"></div>"); 
}]); 

仍然是一样的错误

+0

你的templateUrl是怎么样的? – Danscho

+0

我添加了模板url并发现问题。模板缓存不适用于查询参数,并且我有一个请求拦截器,它将为每个请求添加一个查询参数。 –

回答

4

我发现了错误。

问题是模板被请求使用查询参数,我用请求拦截器添加。我为该拦截器添加了一个与模板url前缀匹配的异常,现在它可以工作。

var noSessionIdUrls = [ 
    "uib/template", 
    "template" 
]; 

app.config(['$httpProvider', function($httpProvider) { 
    $httpProvider.interceptors.push(function ($q, $injector, $rootScope) { 
     return { 
      request: function(config) { 
       for(var i = 0; i < noSessionIdUrls.length; i++) { 
        if(config.url.startsWith(noSessionIdUrls[i])) { 
         console.log("request interceptor: omitting session id"); 
         return config; 
        } 
       } 

       config.url = config.url + '?sessionid=' + window.sessionid; 
       return config; 
      } 
     }; 
    }); 
}]);