AngularJS为链接注入$ timeout?

时间:2015-10-26 14:49:05

标签: angularjs angularjs-directive karma-jasmine karma-mocha

所以这就是我的问题:

我有一个指令:

  autocompleteDirective.$inject = ['$timeout'];
  function autocompleteDirective($timeout) {
    return {
      restrict: 'E',
      scope: {
        searchParam: '=ngModel',
        suggestions: '=data',
        onType: '=onType',
        onSelect: '=onSelect',
        autocompleteRequired: '='
      },
      controller: autocompleteController,
      link: autocompleteLink,
      templateUrl:'modules/components/autocomplete/templates/autocomplete.html'
    };
  }

我的链接功能如下所示:

function autocompleteLink(scope, element, attrs) {

    $timeout(function() {
      scope.initLock = false;
      scope.$apply();
    }, 250);
  .... some other code 

}

和我的控制器(不太相关):

  autocompleteController.$inject = ['$scope'];
  function autocompleteController($scope) { 

  //scope code
}

在我的链接函数中,我有一个使用setTimeout的函数(此时):

  if (attrs.clickActivation) {
      element[0].onclick = function() {
        if (!scope.searchParam) {
          setTimeout(function() {
            scope.completing = true;
            scope.$apply();
          }, 200);
        }
      };
    }

我想对这段代码进行单元测试,但我的单元测试失败了:

elem.triggerHandler('click');
      expect(scope.completing).to.equal(true);

即使在覆盖率报告中,我也可以看到单击triggerHandler时逻辑确实成功执行。

我认为罪魁祸首是超时。

在SO和其他网站上挖掘,我发现使用$ timeout效果最好,因为它暴露于" flush()"方法

我的问题是,我如何"注入" $ timeout到链接功能?

前面的例子我看到直接将$ timeout注入指令,然后在指令声明中嵌入link function():

function directive($timeout){
return {
  link: function(scope, attrs) {
    $timeout(blah!) //timeout is useable here...
}
}

以上对我没有用,因为我没有在指令函数中创建函数...所以根据我使用的模型,我如何在链接中使用$ timeout?

0 个答案:

没有答案