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

Question

我已经阅读了 $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'));
});

虽然我的代码 returns 是 tpl1 的 HTML 代码，但正在为 tpl2 返回路径。我的问题是：如何使用 $templatecache.put().

加载远程模板

感谢您的帮助。

Answer 1

尝试调用远程模板并将其设置在模板缓存中：

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

的文档

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

How to load a remote template using $templatecache.put()

caching

angularjs

angular-templatecache