NgComponent：如何从DOM元素获取组件实例？

Question

我创建了一个NgComponent并在标记中声明了它。是否可以查询组件元素并获取关联的NgComponent实例？

Answer 1

通常，您不需要通过元素访问控制器。也就是说，有introspection API。 ngDirectives将返回给定节点的所有控制器的列表。 但AFAIK仅用于调试 。

或者，如果您需要访问子组件/指令/控制器，请考虑以下模式：

<tabs>
  <pane title="Pane A">...</pane>
  <pane title="Pane B">...</pane>
  <pane title="Pane C">...</pane>
</tabs>

@NgComponent(
    selector: 'tabs',
    visibility: NgDirective.DIRECT_CHILDREN_VISIBILITY
)
class Tabs {
  List<Pane> _panes;

  registerPane(Pane pane) {
    _panes.add(pane);
  }
}

@NgComponent(
    selector: 'pane'
)
class Pane {
  @NgAttr('title')
  String title;

  Pane(Tabs tabs) {
    tabs.registerPane(this);
  }
}

当实例化窗格时，它们会自动注册标签容器，随后标签容器可以访问窗格实例。