有条件地声明视图 child

Question

我在两个有条件地呈现的 div 中有输入框。

html

<div ngIf="show==true">
<input #ref />
</div>

<div ngIf="show==true">
<input #ref />
</div>

.ts

@ViewChild('ref ') ref : ElementRef;

ngOnInit(){

 if(someCondition){
  show = true;
 }

Observable.fromEvent(this.ref .nativeElement, 'keyup');
}

它将未定义的引用显示为在 ngOnInit 之前声明的引用变量

我相信我们不能稍后初始化viewchild，

有什么替代解决方案。

谢谢

Answer 1

您需要访问该 viewchild 组件，如下所示。意味着你必须使用 "ngAfterViewInit" （实现 AfterViewInit ），因为子组件在 "ngOnit" 运行时不可用

  @ViewChild('ref ') ref : ElementRef;

  ngAfterViewInit() {
    console.log('Values on ngAfterViewInit():');
    console.log("ref:", this.ref);
  }

Declare View child conditionally