首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >角业力-具有独立作用域和控制器的指令,调用element.isolateScope()返回未定义的

角业力-具有独立作用域和控制器的指令,调用element.isolateScope()返回未定义的
EN

Stack Overflow用户
提问于 2016-04-14 21:03:39
回答 1查看 685关注 0票数 2

嗨,有这样的指示:

代码语言:javascript
复制
angular.module('xos.uiComponents.table', [])
.directive('xosTable', function(){
  return {
    restrict: 'E',
    scope: {
      data: '=',
      config: '='
    },
    template: `
      <!-- <pre>{{vm.data | json}}</pre> -->
      <table ng-class="vm.classes" ng-show="vm.data.length > 0">
        <thead>
          <tr>
            <th ng-repeat="col in vm.columns">{{col.label}}</th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="item in vm.data">
            <td ng-repeat="col in vm.columns">{{item[col.prop]}}</td>
          </tr>
        </tbody>
      </table>
    `,
    bindToController: true,
    controllerAs: 'vm',
    controller: function(){

      if(!this.config){
        throw new Error('[xosTable] Please provide a configuration via the "config" attribute');
      }

      if(!this.config.columns){
        throw new Error('[xosTable] Please provide a columns list in the configuration');
      }

      this.columns = this.config.columns;
      this.classes = this.config.classes || 'table table-striped table-bordered';

    }
  }
})

我正在尝试测试它,但我无法访问isolateScope(),下面是我的测试代码:

代码语言:javascript
复制
describe('when correctly configured', function() {
  let scope, element, is;

  beforeEach(inject(function ($compile, $rootScope) {
    scope = $rootScope.$new();

    scope.config = {
      columns: [
        {
          label: 'Label 1',
          prop: 'label-1'
        },
        {
          label: 'Label 2',
          prop: 'label-2'
        }
      ]
    };

    scope.data = [
      {
        'label-1': 'Sample 1.1',
        'label-2': 'Sample 1.2'
      },
      {
        'label-1': 'Sample 2.1',
        'label-2': 'Sample 2.2'
      }
    ]

    element = angular.element('<xos-table config="config" data="data"></xos-table>');
    $compile(element)(scope);
    is = element.isolateScope();
    scope.$digest();

  }));

  it('should contain 2 columns', function() {
    expect(is.columns).toEqual(2);
  });
});

我有同样的设置很多次,知道为什么我不能访问我的指令的isolateScope吗?

下面是一个带有代码和测试的柱塞:http://plnkr.co/edit/JYYtck?p=preview

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-04-14 21:54:22

你在考试中犯了三个错误:

  1. 您没有加载包含指令的模块(它加载在一个单独的描述块中)。这就是为什么isolateScope是未定义的;
  2. 您使用scope.columns而不是os scope.vm.columns
  3. 您将列数组与2进行比较,而不是将其长度与2进行比较。

这是固定柱塞

摘录:

代码语言:javascript
复制
beforeEach(module('xos.uiComponents.table'));

[...]

it('should contain 2 columns', function() {
    console.log('aaa', iso);

    // one is the filter, the other two are the products, one is the pagination
    expect(iso.vm.columns.length).toEqual(2);
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/36633957

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档