$ rootScope在这个函数中做什么?

时间:2014-11-21 10:11:05

标签: angularjs unit-testing angularjs-directive rootscope

Angular docs

中的指令单元测试示例中
describe('Unit testing great quotes', function() {
    var $compile;
    var $rootScope;

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

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

    it('Replaces the element with the appropriate content', function() {
        // Compile a piece of HTML containing the directive
        var element = $compile("<a-great-eye></a-great-eye>")($rootScope);
        // fire all the watches, so the scope expression {{1 + 1}} will be evaluated
        $rootScope.$digest();
        // Check that the compiled element contains the templated content
        expect(element.html()).toContain("lidless, wreathed in flame, 2 times");
    });
});

有人可以解释($ rootScope)在it函数中的元素变量声明中正在做什么。

我不确定它有什么影响。

3 个答案:

答案 0 :(得分:1)

它用于强制执行$digest周期,以便立即编译和渲染其上方的元素,而不是等待未确定的$digest周期

答案 1 :(得分:1)

$compile函数创建一个函数,该函数从范围变量中获取值以完成绑定。

当您使用范围变量调用$compile创建的函数时,它会使用您作为参数提供的范围上的值替换所有绑定,并创建DOM元素。

例如:

$rootScope.age = 15;
$scope.age = 52;

var element = $compile("<div>Tom is {{age}}</div>")($rootScope);
/* element is a div with text "Tom is 15" */

var element2 = $compile("<div>Tom is {{age}}</div>")($scope);
/* element2 is a div with text "Tom is 52" */

答案 2 :(得分:1)

Angular中的编译分两步完成。 $compile(template)只执行上半部分,其中指令通常只是转换DOM(以及其他更复杂的东西也会发生;)),并返回“链接函数”。第二部分是在使用特定范围作为参数调用链接函数时完成的。在这一部分中,指令可以编辑范围,链接行为到DOM事件等。更多信息可以在official guide中找到。