Question

我有一个像<div some-dir="5" />

这样的AngularJS指令示例

如何在我的测试中访问5的此指令属性值？

describe("some-dir", function() {
    var element, scope;
    beforeEach(module('app'));
    beforeEach(inject(function($rootScope, $compile) {

        scope = $rootScope;
        element = angular.element('<div><div id="el1" some-dir="5" /></div>');
        $compile(element)(scope);
        scope.$digest();

    }));

    it('should be able to get the attribute value', function(){

       // get the attr value of some-dir


    });

});

Answer 1

您可以使用 isolateScope 方法检查元素的范围值。但是当你在directive属性旁边传递一个值时，这不会起作用，因为这些值不会被复制到隔离的范围内。

在这种情况下，可以使用 element.attributes 方法获取并测试该值。

首先编译你的指令html：

var element;

beforeEach(inject(function (_$compile_, _$rootScope_) {
    var $compile = _$compile_,
        $scope = _$rootScope_;

    element = $compile('<div my-directive="4" some-value="5"></div>')($scope);
    $scope.$digest();
}));

然后你可以期待元素的isolateScope返回一个带有 someValue 属性的对象。

it('should expect some-value as 5', function () {
    inject(function ($injector) {
        // check attribute values using isolateScope
        expect(element.isolateScope().someValue).toEqual(5);

        // check the value right after directive attribute
        expect(element.attr('my-directive')).toEqual('4');
    });
});

以下是plunker示例。

茉莉花测试中的Access指令属性值

1 个答案: