angularjs - 测试 Angular 指令时，isolateScope() 返回未定义

Question

使用 Angular v1.2.25 和 rails Assets 管道，我试图测试指令的隔离范围确实已更新。由于isolateScope() 返回undefined，我期望undefined 被定义......'

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();
  }); 

我希望指令范围是可访问和可测试的，但是当我测试它时却没有定义。谢谢你。

Answer 1

获取isolateScope我使用以下代码

compiledElem.children().scope()

这是因为大多数指令不使用 replace ，这意味着 directive标签在页面上，并且 directive implementation添加为该标签的子项。
在这种情况下，隔离范围将属于子级。

即使情况并非如此，该代码段仍应有效 - 因为 child 将共享 parent 的范围..

它不起作用的唯一情况是一种极端情况，其中您有 2 个嵌套指令，其中内部指令使用替换。但我从未见过这个。