修改TestBed.overrideComponent中定义的组件

Question

我们正在使用

TestBed.overrideComponent(CoolComponent, {
    set: {
      template: '<div id="fake-component">i am the fake component</div>',
      selector: 'our-cool-component',
      inputs: [ 'model' ]
    }
  })

覆盖组件.

该组件有一个ViewChild,我们在ngOnInit方法中配置它

@Component({
  selector: 'our-cool-component',
  templateUrl: 'cool.component.html'
})
export class CoolComponent implements OnInit, OnDestroy {
  @Input() model: SomeModel
  @ViewChild(CoolChildComponent) coolChildComponent;

  ngOnInit() {
    this.coolChildComponent.doStuff();
  }
}

在CoolComponent又住在一个Wrapper组件.

当我们调用fixture.detectChanges()上的Wrapper夹具,这个试图构建CoolComponent,但是当它调用doStuff立即死亡(),因为CoolChildComponent是不确定的.

有没有办法找到CoolComponent它的存根CoolChildComponent？看起来我们不能把它搞定,Wrapper因为它只是通过模板引用,而不是作为组件的属性引用.

Answer 1

ngOnInit() {
  this.coolChildComponent.doStuff();
}

应该

ngAfterViewInit() {
  this.coolChildComponent.doStuff();
}

因为

在调用ngAfterViewInit回调之前设置视图子项.