Angular 2 : get elementref on child component from parent

Question

我正在尝试从其父组件获取子组件的 ElementRef。

@Component({
moduleId: module.id,
selector: 'parent',
templateUrl: 'parent.component.html',
directives: [
  Child1Component,
  Child2Component
  ]
})

在 Child1Component 的 html 中我有

  <button class="btn btn-primary" #myRef>Select File</button>

在家长类:

export class ParentComponent implements OnInit {
  @ViewChild('myRef') myRef: ElementRef;
  // ...

但是当然，当我尝试访问父类中的子 ElementRef 时...

ngAfterViewInit() {
  console.log(this.myRef.nativeElement);

...我得到 undefined .我应该如何获得 ElementRef？谢谢!

Answer 1

您现在可以执行此操作。

@ViewChild('myRef', {read: ElementRef}) myRef: ElementRef

默认情况下，如果您的模板引用变量附加到自定义组件，Angular 将获取组件引用。 read选项告诉 angular 要拉哪个 token ，所以你可以明确告诉它拉 ElementRef token 而不是您尝试读取的任何组件的类实例。