在测试angular指令时，isolateScope（）返回undefined [英] isolateScope() returning undefined when testing angular directive

问题描述

使用Angular v1.2.25和rails资产管道，我试图测试指令的隔离范围确实已经更新。由于isolateScope（）返回undefined我得到预期未定义的定义...'

Using Angular v1.2.25 and rails asset pipeline, I am attempting to test that a directive's isolate scope has indeed been updated. Since isolateScope() returns undefined I am getting expected undefined to be defined ...'

describe("cool directive", function() {

  beforeEach(module('necessaryModule'));

  var scope, $rootScope, $compile, elem,
    baseElement = '<div auto="mock_a" inc="mock_p" method="mock_m" reset-method="mock_r"></div>';

  beforeEach(inject(function( _$rootScope_, _$compile_, _$httpBackend_, $http){
    $compile = _$compile_;
    $rootScope = _$rootScope_;
    scope = $rootScope.$new();
    angular.extend(scope, {
      mock_a: [
        {name: "example1"},
        {name: "example2"}
      ],  
      mock_m: function(){
        return $http.get('/mockBackend', {
          params:{
            page:  scope.mockPage
          }   
        }); 
      },  
      mock_r: function() {
        scope.page = 1;
        scope.list = []; 
        load();
      },  
      mock_p: 1
    }); 
    $httpListGet = _$httpBackend_;
    $httpListGet.whenPOST('/api/something').respond({});
    $httpListGet.whenGET('/mockBackend').respond({name: "example3"});
    $httpListGet.whenGET('/mockBackend?page=1').respond({name: "example3"});
    $httpListGet.whenGET('/mockBackend?page=2').respond({name: "example4"});
  }));

    var create = function() {
      elem = angular.element(baseElement);
      compiledElement = $compile(elem)(scope);
      elem.scope().$apply();
      return compiledElement;
    };  

  it("has 'list' defined", function() {
    var compiledElem = create();
    var isolateElemScope = compiledElem.isolateScope();
    $rootScope.$apply();
    console.log('isolateElemScope',isolateElemScope);
    expect(isolateElemScope.list).toBeDefined();
  }); 

我期望指令范围可以访问和测试，但是我在未定义测试它。谢谢。

I'm expecting the directives scope to be accessible and testable, but I'm getting undefined when I test for it. Thank you.

推荐答案

获取isolateScope我使用以下代码

to get the isolateScope I use the following code

compiledElem.children().scope()

这是因为大多数指令不使用 replace ，这意味着页面上有指令标记，而指令实现被添加为该标记的子级。
在这种情况下，隔离范围将属于子项。

This is because that most directives don't use replace, which means the directive tag is on the page, and the directive implementation is added as children of that tag. In that case, the isolate scope will belong to the children.

即使不是这种情况，代码片段仍应有效 - 因为孩子们会分享父级的范围..

Even if that is not the case, the snippet should still work - as the children will share the parent's scope..

唯一不起作用的情况是，你有2个嵌套指令，其中内部指令使用replace。但我从未见过这个。

The only case it won't work, is an extreme scenario where you have 2 nested directives, where the inner one uses replace. but I never saw this.

这篇关于在测试angular指令时，isolateScope（）返回undefined的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！