角度模板缓存无法正常工作

Question

我有一个使用gulp和angular的项目.我想点击一个按钮和一个包含要显示的html的弹出窗口.

在build.js文件中,我有以下代码:

gulp.task('templates', function() {
  gulp.src(['!./apps/' + app + '/index.html', './apps/' + app + '/**/*.html'])
    .pipe(plugins.angularTemplatecache('templates.js', {
      standalone: true,
      module: 'templates'
    }))
    .pipe(gulp.dest(buildDir + '/js'));
});

在我的app.js文件中我有:

.controller('PopupCtrl', function($scope, ngDialog) {
  $scope.clickToOpen = function () {
      ngDialog.open({ 
        template: 'templates/popup.html'
      });
  };
})

单击按钮时出错:

GET http://mylocalhost:3000/templates/popup.html 404 (Not Found) 

我的templates.js文件包含:

angular.module("templates", []).run(["$templateCache", function($templateCache) {
$templateCache.put("templates/popup.html", "my html") ...etc

为什么模板缓存无法识别对templates/popup.html的调用并显示缓存中的内容而不是查看404'd的URL？

只是说我尝试了什么,我手动将模板文件复制到它正在查找的目录中并找到它.这不是解决方案,因为我希望它从缓存中获取.

谢谢

Answer 1

您还必须将templates模块指定为模块的依赖项.例如:

angular.module('myApp', ['templates', 'ngDialog'])

希望这可以帮助.

Answer 2

这个答案适用于可能遇到此问题的其他任何人,但他们确信他们确实包含了依赖关系,因为接受的答案表明:

确保验证您正在使用匹配的"密钥".在我的场景中,发生了以下情况:

$templateCache.put('/someurl.html', 'some value');

但它一直在寻找'someurl.html'.我将代码更新为:

$templateCache.put('someurl.html', 'some value');

一切都开始奏效了.