Javascript 如何测试指令'；s控制器使用angularJS karma jasmine？ 目标：

为

waCarousel

指令范围变量编写一个通过测试：

self.awesomeThings

。当

self.awsomeThings.length.toBe（3）

to为真时，期望此测试通过

问题： 如何正确编写此测试？相反，如何注入指令控制器

---

指令：

angular.module('carouselApp')
    .directive('waCarousel', function() {
        return {
            templateUrl: '../../../views/carousel/wa.carousel.html',
            controller: function($scope) {
                var self = this;

                self.awesomeThings = [1, 2, 3];

                return $scope.carousel = self;
            }
        }
    });

describe('waCarousel Unit', function() {
  // am I missing a $controller & namespace variable init?
   var $compile,
      $rootScope;


  // Load the myApp module, which contains the directive
  beforeEach(module('carouselApp'));

  // Store references to $rootScope and $compile and $controller
  // so they are available to all tests in this describe block
  beforeEach(inject(function(_$compile_, _$rootScope_, _$controller_){
    // The injector unwraps the underscores (_) from around the parameter names when matching
    $compile = _$compile_;
    $rootScope = _$rootScope_;
    $controller = _$controller_;
     //   WaCarouselCtrl = $controller('WaCarouselCtrl', {
     //       $scope: scope
     //   });
  }));

  it('should have a list of awesomeThings', function() {
    // This wont pass       
    expect(scope.awesomeThings.length).toBe(3);
  });
});

单元测试：

angular.module('carouselApp')
    .directive('waCarousel', function() {
        return {
            templateUrl: '../../../views/carousel/wa.carousel.html',
            controller: function($scope) {
                var self = this;

                self.awesomeThings = [1, 2, 3];

                return $scope.carousel = self;
            }
        }
    });

describe('waCarousel Unit', function() {
  // am I missing a $controller & namespace variable init?
   var $compile,
      $rootScope;


  // Load the myApp module, which contains the directive
  beforeEach(module('carouselApp'));

  // Store references to $rootScope and $compile and $controller
  // so they are available to all tests in this describe block
  beforeEach(inject(function(_$compile_, _$rootScope_, _$controller_){
    // The injector unwraps the underscores (_) from around the parameter names when matching
    $compile = _$compile_;
    $rootScope = _$rootScope_;
    $controller = _$controller_;
     //   WaCarouselCtrl = $controller('WaCarouselCtrl', {
     //       $scope: scope
     //   });
  }));

  it('should have a list of awesomeThings', function() {
    // This wont pass       
    expect(scope.awesomeThings.length).toBe(3);
  });
});

对于典型视图，而不是指令，我会这样做：

我如何合并这两个概念，以便我可以期望

self.awesomeThings.length）.成为（3）

更新：

元素，调用后，您将可以使用

awesomeThings

数组访问包含

carousel

对象的作用域：

describe('waCarousel Unit', function() {
    var scope;

    beforeEach(module('carouselApp'));
    beforeEach(inject(function($rootScope, $compile) {
        var element = '<test></test>';

        scope = $rootScope.$new();

        element = $compile(element)(scope);
        scope.$digest();
    }));

    it('should have a list of awesomeThings', function() {    
        expect(scope.carousel.awesomeThings.length).toBe(3);
    });
});

description（'waCarousel Unit'，function（）{
var范围；
在每个模块之前（模块（“旋转木马”）；
beforeach（注入（函数（$rootScope，$compile）{
var元素=“”；
scope=$rootScope.$new（）；
元素=$compile（元素）（范围）；
范围。$digest（）；
}));
它（'应该有一个awesomeThings'的列表'，函数（）{
期望（范围、旋转木马、惊人事物、长度）为（3）；
});
});

此外，以下是一些有用的链接，指向angular中的测试指令：

---

我想你可以这样做，但不确定它是否符合你的需要：更新了上面的图片，上面显示了一些未定义的东西：c有什么想法吗？我从@themyth92的评论中准确地找到了它。我还没有理解差异的细微差别。问题是当指令是attr时，你把它作为一个元素。更正并标记为正确。