如何使用$ templatecache.put()加载远程模板

时间:2017-02-27 20:45:11

标签: angularjs caching angular-templatecache

我已阅读$ templateCache的文档,但我仍然在努力了解如何使用put函数将远程模板加载到缓存中。

以下是一个例子:

onBoardingApp.run(function ($templateCache, $http) {
  $templateCache.put('tpl1.html', '<p>Hello World</p>');
  $templateCache.put('tpl2.html', '~/Templates/Pi/pi-1.html');
  alert($templateCache.get('tpl1.html'));
  alert($templateCache.get('tpl2.html'));
}); 

虽然我的代码返回了tpl1的HTML代码,但是为tpl2返回了路径。我的问题是:如何使用$ templatecache.put()加载远程模板。

感谢您的帮助。

1 个答案:

答案 0 :(得分:4)

尝试调用远程模板并在templateCache上进行设置:

onBoardingApp.run(function ($templateCache, $http) {
    $templateCache.put('tpl1.html', '<p>Hello World</p>');
    console.log($templateCache.get('tpl1.html'));
    $http.get('/Templates/Pi/pi-1.html').then(function (response) {
        $templateCache.put('tpl2.html', response.data);
        console.log($templateCache.get('pl2.html'));
    }, function (errorResponse) {
        console.log('Cannot load the file template');
    });
}); 

主要原因是angularjs的templateCache只接收字符串值,而不是像指令那样,例如你可以拥有templateUrl。

Here是此ng-service的文档