我有一个我正试图测试的指令。这是指令:
App.directive('resize', function($animate) {
return function(scope, element, attrs) {
scope.$watch(attrs.resize, function(newVal) {
if(newVal) {
$animate.addClass(element, 'span8');
}
});
};
});
这是我的测试:
describe('resize', function() {
var element, scope;
beforeEach(inject(function($compile, $rootScope) {
var directive = angular.element('<div class="span12" resize="isHidden"></div>');
element = $compile(directive)($rootScope);
$rootScope.$digest();
scope = $rootScope;
}));
it('should change to a span8 after resize', function() {
expect($(element).hasClass('span12')).toBeTruthy();
expect($(element).hasClass('span8')).toBeFalsy();
element.scope.newVal = 'changed';
scope.$apply();
expect($(element).hasClass('span8')).toBeTruthy();
});
});
我正在尝试访问我的attrs
变量,更改它,$apply
并查看class
是否按预期更改。我无法更改attrs
。我实际上甚至找不到访问它的方法。如何在我的测试中访问attrs
?
答案 0 :(得分:1)
element
是一个jqLite object,或一个普通的jQuery对象(如果你在AngularJS之前加载jQuery)。只需使用.attr()
方法:
it('should do something on attr change', function(){
element.attr('resize', 'newValue');
$scope.$apply();
});
没有必要将元素包装在新的jQuery对象中:$(element)
以使用.hasClass(value)
方法