我正在写指令测试与茉莉花AngularJS，并使用templateUrl与他们： https://gist.github.com/tanepiper/62bd10125e8408def5cc
然而，当我运行测试，我得到列入要点的错误：
Error: Unexpected request: GET views/currency-select.html
从我在我以为文档读过我是正确的这样做，但它似乎不那么 - 我缺少什么吗？
谢谢
Answer 1:
如果您使用ngMockE2E或ngMock：
所有的HTTP请求是在本地处理使用您指定的规则， 没有被传递到服务器。 由于模板通过HTTP请求时，也将在本地处理。 既然你没有指定什么时候做您的应用程序试图连接到views/currency-select.html ，它会告诉你它不知道如何处理它。 您可以轻松地告诉ngMockE2E沿着你的模板请求传递：
$httpBackend.whenGET('views/currency-select.html').passThrough();
请记住，你也可以使用正则表达式在你的路由路径通过所有的模板，如果你愿意的话。
该文档详细讨论这一点： http://docs.angularjs.org/api/ngMockE2E.$httpBackend
否则，使用这样的：
你需要使用$injector来访问新的后端。 从链接的文档：
var $httpBackend;
beforeEach(inject(function($injector) {
$httpBackend = $injector.get('$httpBackend');
$httpBackend.whenGET('views/currency-select.html').respond(200, '');
}));
Answer 2:
噶的方法是动态加载HTML模板到$ templateCache。 你可以只使用html2js因缘预处理器，如解释在这里
这归结于添加模板“ 的.html”您的文件在文件conf.js以及预处理程序= {“的.html”：“html2js”};
和使用
beforeEach(module('..'));
beforeEach(module('...html', '...html'));
到您的JS测试文件
Answer 3:
如果这是一个单元测试，你将不能访问$httpBackend.passthrough() 这是只适用于ngMock2E2，最终到终端的测试。 我与涉及的答案同意ng-html2js （用来命名html2js），但我想他们扩大在这里提供一个完整的解决方案。
为了使您的指令，角使用$http.get()来从你的模板templateUrl 。 因为这是单元测试和angular-mocks被加载， angular-mocks拦截调用$http.get()给你Unexpected request: GET错误。 你可以想方设法通过通过这个，但它更简单，只需使用角度的$templateCache预加载你的模板。 这样， $http.get()甚至不会是一个问题。
那是什么NG-html2js预处理为你做。 为了把它的工作，先安装：
$ npm install karma-ng-html2js-preprocessor --save-dev
然后，通过在添加/更新以下字段配置它karma.conf.js
{
files: [
//
// all your other files
//
//your htmp templates, assuming they're all under the templates dir
'templates/**/*.html'
],
preprocessors: {
//
// your other preprocessors
//
//
// tell karma to use the ng-html2js preprocessor
"templates/**/*.html": "ng-html2js"
},
ngHtml2JsPreprocessor: {
//
// Make up a module name to contain your templates.
// We will use this name in the jasmine test code.
// For advanced configs, see https://github.com/karma-runner/karma-ng-html2js-preprocessor
moduleName: 'test-templates',
}
}
最后，在您的测试代码，使用test-templates您刚才创建的模块。 只需添加test-templates的模块调用，您通常使beforeEach ，就像这样：
beforeEach(module('myapp', 'test-templates'));
它应该是一帆风顺从这里开始了。 为了更深入地了解这个和其他指令测试场景，看看这个帖子
Answer 4:
也许你可以得到$templatecache从注射器，然后像做
$templateCache.put("views/currency-select.html","<div.....>");
其中代替<div.....>你要放你的模板。
您在安装后，你的指令，它应该工作就好了！
Answer 5:
如果仍不能工作，使用Fiddler看到htmltojs处理器动态生成的js文件的内容和检查模板文件的路径。
它应该是这样的
angular.module('app/templates/yourtemplate.html', []).run(function($templateCache) {
$templateCache.put('app/templates/yourtemplate.html',
就我而言，这是不一样的我在这是导致该问题的实际指令了。
具有templateURL在所有地方完全一样让我通过。
Answer 6:
按照要求，注释转换为答案。
对于谁想要使用的@利奥尔在约曼回答Apps中的人：
有时路模板因果报应配置引用，因此-模块所产生的名字ng-html2js不匹配指定的值templateUrl在指令定义秒。
您需要调整生成的模块名称匹配templateUrl秒。
这些可能会有所帮助：
- https://github.com/karma-runner/karma-ng-html2js-preprocessor#configuration
- 要点： https://gist.github.com/vucalur/7238489
Answer 7:
这是示例如何测试使用部分作为templateUrl指令
describe('with directive', function(){
var scope,
compile,
element;
beforeEach(module('myApp'));//myApp module
beforeEach(inject(function($rootScope, $compile, $templateCache){
scope = $rootScope.$new();
compile = $compile;
$templateCache.put('view/url.html',
'<ul><li>{{ foo }}</li>' +
'<li>{{ bar }}</li>' +
'<li>{{ baz }}</li>' +
'</ul>');
scope.template = {
url: 'view/url.html'
};
scope.foo = 'foo';
scope.bar = 'bar';
scope.baz = 'baz';
scope.$digest();
element = compile(angular.element(
'<section>' +
'<div ng-include="template.url" with="{foo : foo, bar : bar, baz : baz}"></div>' +
'<div ng-include="template.url" with=""></div>' +
'</section>'
))(scope);
scope.$digest();
}));
it('should copy scope parameters to ngInclude partial', function(){
var isolateScope = element.find('div').eq(0).scope();
expect(isolateScope.foo).toBeDefined();
expect(isolateScope.bar).toBeDefined();
expect(isolateScope.baz).toBeDefined();
})
});
Answer 8:
如果您使用的是茉莉花Maven的插件一起RequireJS可以使用文本插件加载模板内容到一个变量，然后把它放在模板缓存。
define(['angular', 'text!path/to/template.html', 'angular-route', 'angular-mocks'], function(ng, directiveTemplate) {
"use strict";
describe('Directive TestSuite', function () {
beforeEach(inject(function( $templateCache) {
$templateCache.put("path/to/template.html", directiveTemplate);
}));
});
});
文章来源: Jasmine tests AngularJS Directives with templateUrl
