我正在尝试实现一个依赖范围变量的测试。我想启用 ng-switch-when 来解析表达式。这就是我想要做的(更新使用 $rootScope):
it('should switch on array changes', inject(function($rootScope, $compile) {
element = $compile(
'<div ng-switch="select">' +
'<div ng-switch-when="test[0]">test[0]:{{test[0]}}</div>' +
'</div>')($rootScope);
expect(element.html()).toEqual('<!-- ngSwitchWhen: test[0] -->');
$rootScope.test = ["leog"];
$rootScope.select = "leog";
$rootScope.$apply();
expect(element.text()).toEqual('test[0]:leog');
}));
我的问题是,我为此工作所执行的实现无法让作用域变量“test”进行评估并按我的预期工作。这是实现:
var ngSwitchWhenDirective = ngDirective({
transclude: 'element',
priority: 800,
require: '^ngSwitch',
compile: function(element, attrs) {
return function(scope, element, attr, ctrl, $transclude) {
var expr = scope.$eval(attrs.ngSwitchWhen),
ngSwitchWhen = expr !== undefined ? expr : attrs.ngSwitchWhen;
ctrl.cases['!' + ngSwitchWhen] = (ctrl.cases['!' + ngSwitchWhen] || []);
ctrl.cases['!' + ngSwitchWhen].push({ transclude: $transclude, element: element });
};
}
});
有人知道我做错了什么吗?任何帮助将不胜感激。
提前致谢!
更新
澄清一下,这是 Angular 团队如何测试 ng-switch 的示例。只是为了表明我正在以类似的方式进行测试,但没有得到预期的结果。
而且,我忘记将我的代码反转为 $rootScope,到目前为止,您所看到的是我尝试创建一个新作用域以避免依赖 $rootScope 进行更改的尝试之一。
it('should switch on value change', inject(function($rootScope, $compile) {
element = $compile(
'<div ng-switch="select">' +
'<div ng-switch-when="1">first:{{name}}</div>' +
'<div ng-switch-when="2">second:{{name}}</div>' +
'<div ng-switch-when="true">true:{{name}}</div>' +
'</div>')($rootScope);
expect(element.html()).toEqual(
'<!-- ngSwitchWhen: 1 --><!-- ngSwitchWhen: 2 --><!-- ngSwitchWhen: true -->');
$rootScope.select = 1;
$rootScope.$apply();
expect(element.text()).toEqual('first:');
$rootScope.name="shyam";
$rootScope.$apply();
expect(element.text()).toEqual('first:shyam');
$rootScope.select = 2;
$rootScope.$apply();
expect(element.text()).toEqual('second:shyam');
$rootScope.name = 'misko';
$rootScope.$apply();
expect(element.text()).toEqual('second:misko');
$rootScope.select = true;
$rootScope.$apply();
expect(element.text()).toEqual('true:misko');
}));
最佳答案
因此,在移动了一些代码之后,我发现应该在编译要测试的元素之前定义与更改 $rootScope 以测试功能无关的变量。感谢@Jonathan 的提示。
这是带有附加测试用例的工作代码:
it('should evaluate expressions to match switch value', inject(function($rootScope, $compile) {
$rootScope.array = ["leog", ".me"];
$rootScope.obj = {"key": "value"};
$rootScope.$apply();
element = $compile(
'<div ng-switch="select">' +
'<div ng-switch-when="obj.key">obj.key:{{obj.key}}</div>' +
'<div ng-switch-when="array[0]">array[0]:{{array[0]}}</div>' +
'<div ng-switch-when="array[1]">array[1]:{{array[1]}}</div>' +
'</div>')($rootScope);
expect(element.html()).toEqual('<!-- ngSwitchWhen: obj.key -->' +
'<!-- ngSwitchWhen: array[0] -->' +
'<!-- ngSwitchWhen: array[1] -->');
$rootScope.select = "value1";
$rootScope.$apply();
expect(element.text()).toEqual('obj.key:value');
$rootScope.select = "leog";
$rootScope.$apply();
expect(element.text()).toEqual('array[0]:leog');
$rootScope.select = ".me";
$rootScope.$apply();
expect(element.text()).toEqual('array[1]:.me');
}));
谢谢大家。
关于unit-testing - 测试 AngularJS 范围变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20482653/