使用@Input测试Angular 2组件

发布时间：2020-12-17 18:09:01 所属栏目：安全来源：网络整理

导读：我正在尝试测试我的Angular 2组件,用新的MyComponent()实例化.但是,对于采用@Inputs的组件,我如何传递它们？然后,如果实例化,说我想改变输入.这只是重新分配我传入的变量的问题吗？解决方法如果使用new创建实例,则无法执行任何其他操作来分配字段.您可以使

我正在尝试测试我的Angular 2组件,用新的MyComponent()实例化.但是,对于采用@Inputs的组件,我如何传递它们？然后,如果实例化,说我想改变输入.这只是重新分配我传入的变量的问题吗？

解决方法

如果使用new创建实例,则无法执行任何其他操作来分配字段.您可以使用TestComponentBuilder来获取更改检测和绑定.

下面是测试BwuArraySelector组件的Dart代码示例.
我假设你可以弄清楚如何在TS中做到这一点.

/// Component only for testing BwuArraySelector
@Component(
    selector: 'test-cmp-singleconfigured',directives: const [BwuArraySelector],template: '''
<bwu-array-selector #singleConfigured
  [items]='[{"name": "one"},{"name": "two"},{"name": "three"}]'>
</bwu-array-selector>
''')
class SingleConfigured {
  @ViewChild('singleConfigured') BwuArraySelector arraySelector;
}

…

// inject the TextComponentBuilder and create a component instance
ngTest('single selection',(TestComponentBuilder tcb) async {
  ComponentFixture tc = await tcb.createAsync(SingleConfigured);
  tc..detectChanges();
  BwuArraySelector el =
      (tc.componentInstance as SingleConfigured).arraySelector;

对detectChanges()的调用使用SingleConfigured测试组件模板绑定中的值初始化BwuArraySelector的输入.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!