angularjs - Karma 测试未找到缓存模板

Question

我正在尝试测试一个从 URL 中提取模板的指令。

我正在使用 Karma 的 html2js 预处理器。以下是我的 karma.conf.js 中的相关配置:

    // list of files / patterns to load in the browser
files: [
    'angular/jquery-1.9.1.min.js',
    'angular/angular.js',
    'angular/angular-*.js',
    'angular/ui-bootstrap-0.6.0.min.js',
    'angular/healthpro-ng-commons.js',
    '../../main/webapp/js/app.js',
    '../../main/webapp/js/**/*.js',
    '../../main/webapp/js/templates/**/*.html',
    'unit/**/*.js'
],

preprocessors: {
    //location of templates
    '../../main/webapp/js/templates/**/*.html': 'html2js'
}

这是我的 Karma 测试的一部分:

describe('NoteDirective', function() {

var fixture, scope, $compile, $rootScope, template;

beforeEach(function() {
module('CrossReference');
});

beforeEach(inject(function($templateCache, _$compile_, _$rootScope_) {
  template = $templateCache.get('../../main/webapp/js/templates/Note.html');
  console.log('Template......', template);
  $templateCache.put('/CrossReference-portlet/js/templates/Note.html', template);   

  $compile = _$compile_;
  $rootScope = _$rootScope_;
}));

});

记录模板显示它未定义。有什么建议吗？

我也尝试过像这样调整预处理:

 ngHtml2JsPreprocessor: {
    stripPrefix: '../../main/webapp',
    prependPrefix: '/CrossReference-portlet'
}

然后将模板作为模块加载:

beforeEach(module('/CrossReference-portlet/js/templates/Note.html'));

运气不好。有什么想法吗？

Answer 1

对于那些仍在为此苦苦挣扎的人:
您可以尝试将 moduleName 添加到 karma 配置中的 html2js 预处理器配置

// karma config file
...
ngHtml2JsPreprocessor: {
    // the name of the Angular module to create
    moduleName: "myApp.templates"
}

然后在测试中，您需要将此模块与主模块一起加载，因此它将模板添加到缓存中

// in your test spec
beforeEach(module('myApp'));
beforeEach(module('myApp.templates'));
beforeEach(inject(function($templateCache) {
    $templateCache.get('path/to/your/file.html');
});

这对我有用。