在单元测试嘲讽ngModel [英] Mocking ngModel in unit tests

问题描述

我尝试编写单元测试使用链接的功能，并且没有任何与之相关的模板的指令。该指令要求 ngModel 是这样的：

  angular.module（'某些模块'，[]）。指令（someDirective'，函数（）{
  返回{
    限制：'A'，
    要求：'ngModel'，
    链接：功能（范围，元素，属性控制器）{
      //做一点事
    }
  };
}）;
 

当试图单元测试这一点，我只是尝试编译DIV触发指令：

 变量$范围= $ rootScope $新的（）。
VAR元= $编译（'＆LT; D​​IV一些指导性＆GT;＆LT; / DIV＆GT;'）（$范围内）;
$ $范围摘要（）。
 

不过，这触发了 ngModel 控制器无法找到一个错误。在文档寻找 ngModel 并的 ngModelController 我试着用嘲讽 ngModel 的 $提供这样的服务：

  beforeEach（模块（函数（$提供）{
  变种mockNgModel = {};
  $ provide.value（'ngModel'，mockNgModel）; //不工作
  $ provide.value（'ngModelCtrl'，mockNgModel）; //不工作
  $ provide.value（'ngModel.NgModelController'，mockNgModel）; //不工作
  $ provide.value（'ngModel.ngModelController'，mockNgModel）; //不工作
}））;
 

我也看到了谈关于创建包含范围属性的其他解决方案的任何 ngModel 在正在使用您的指令中的HTML势必（如解决方法1 ，<一个href=\"http://stackoverflow.com/questions/15219717/to-test-a-custom-validation-angular-directive\">solution2)但这并没有解决的错误我的情况。

解决方案

 变量$范围= $ rootScope $新的（）。
$ scope.foo ='吧';
VAR元= $编译（'＆LT; D​​IV一些指导性NG模型=foo的＆GT;＆LT; / DIV＆GT;'）（$范围内）;
$ $范围摘要（）。
 

I am trying to write unit tests for a directive that uses a link function and does not have any template associated with it. The directive requires ngModel like this:

angular.module('some-module', []).directive('someDirective', function() {
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, element, attr, controller) {
      //Do something
    }
  };
});

When trying to unit test this, I'm just trying to compile a DIV to trigger the directive:

var $scope = $rootScope.$new();
var element = $compile('<div some-directive></div>')($scope);
$scope.$digest();

But this triggers an error that the ngModel controller cannot be found. After looking at the documentation for ngModel and ngModelController I've tried mocking ngModel using the $provide service like this:

beforeEach(module(function($provide) {
  var mockNgModel = {};
  $provide.value('ngModel', mockNgModel); //Doesn't work
  $provide.value('ngModelCtrl', mockNgModel); //Doesn't work
  $provide.value('ngModel.NgModelController', mockNgModel); //Doesn't work
  $provide.value('ngModel.ngModelController', mockNgModel); //Doesn't work
}));

I've also seen other solutions that talk about creating a property on the scope which contains whatever ngModel is bound to in the HTML where your directive is being used (e.g. solution1, solution2) but this has not solved the error in my case.

解决方案

var $scope = $rootScope.$new();
$scope.foo = 'bar';
var element = $compile('<div some-directive ng-model="foo"></div>')($scope);
$scope.$digest();

这篇关于在单元测试嘲讽ngModel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！