Methods Angular2从父级访问子组件中的方法

我的问题是关于如何从父组件访问子组件方法。我找到了下面例子描述的解决方案，但我担心这可能是我做得不对，而不是“角度正确”

例如，我们有一个孩子：

@Component({ ... })
export class Modal {
    ...
    open() {
        ...
    }
}

和家长：

import { Modal } from '../common';
...
@Component({
  selector: 'editor',
  directives: [ Modal ],
  templateUrl: './editor.html',
  ...
})
export class Editor {

    _modal = null;

    ...

    bindModal(modal) { this._modal=modal; }

    open() {
        this._modal.open();
    }
}

在editor.html中：

<button (click)="open()">Open Editor</button>

<modal #editModal>{{ bindModal(editModal) }}
    Here is my editor body in modal (popup) window
    ...
</modal>

打开编辑器
{{bindModal（editModal）}
这是我在模态（弹出）窗口中的编辑器主体
...

---

这是从编辑器组件访问模态组件内部的

open（）

方法的解决方案。这有点棘手。问题是：有没有一种不使用“bindModal”方法的最简单、更直接的方法？

有很多方法

@ViewChild

---

另一种方法是使用父方法，并且可以从父方法本身访问子方法。

有很多方法。

@ViewChild

decorator被解释为可以访问多个实例。使用Ok，但是告诉我，如果在editor.html中我有多个模式怎么办？例如？我问题中的解决方案描述将起作用（但我们必须实现bindModal2方法），然后，您可以使用#LocalVariable，检查给定答案的链接，或者使用

exportAs

。事实上，在问题中的示例中，我使用#LocalVariable-因此在多模态的情况下，有问题的解决方案是正确的（当然，我们需要实现bindModal2或bindModal（editmodolone，'modolone'），并将其放入{modolone:editmodolone，modalTwo:editmodoltwo}等。

import  {ViewChild} from '@angular/core';
import { Modal } from '../common';
...
@Component({
  selector: 'editor',
  directives: [ Modal ],
  templateUrl: './editor.html',
  ...
})
export class Editor {
 @ViewChild(Modal) md:Modal;

 Open()
 {
    this.md.open();
 }

}