Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了单元测试一个AngularJS指令,用于监视具有隔离范围的属性大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个使用隔离范围的数据传递给随时间变化的指令的指令.它监视该值的变化,并对每个变化进行一些计算.当我尝试对该指令进行单元测试时,我无法得到手表触发(为简洁起见,但基本概念如下所示):

指示:

angular.module('directives.file',[])
.directive('file',function() {
  return {
    reStrict: 'E',scope: {
      data: '=',filename: '@',},link: function(scope,element,attrs) {
      console.log('in link');
      var convertToCSV = function(newItem) { ... };

      scope.$watch('data',function(newItem) {
        console.log('in watch');
        var csv_obj = convertToCSV(newItem);
        var blob = new Blob([csv_obj],{type:'text/plain'});
        var link = window.webkitURl.createObjectURL(blob);
        element.html('<a href=' + link + ' download=' + attrs.filename +'>Export to CSV</a>');
      },truE);
    }
  };
});

测试:

describe('Unit: File export',function() {
  var scope;

  beforeEach(module('directives.file'));
  beforeEach(inject(function ($rootScope,$compilE) {
    scope = $rootScope.$new();
  };

  it('should create a CSV',function() {
    scope.input = someData;
    var e = $compile('<file data="input" filename="filename.csv"></file>')(scopE);
    //I've also tried below but that does not Help
    scope.$apply(function() { scope.input = {}; });
  });

我可以做什么来触发手表,所以我的“在手表”调试声明被触发?我的“链接”在编译时被触发.

为了触发一个$watch,一个摘要循环必须发生在它定义的范围上,或者在它的父项上.由于您的指令创建了一个隔离范围,因此它不会从父范围继承,因此在您调用适用范围上的$apply之前,其观察者将不会被处理.

您可以通过对$compile服务返回的元素调用scope()来访问指令范围:

scope.input = someData;
var e = $compile('<file data="input" filename="filename.csv"></file>')(scopE);
e.isolateScope().$apply();

这个jsFiddler就是这个例子.

大佬总结

以上是大佬教程为你收集整理的单元测试一个AngularJS指令,用于监视具有隔离范围的属性全部内容,希望文章能够帮你解决单元测试一个AngularJS指令,用于监视具有隔离范围的属性所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。