11、ContentChild和ViewChild

在6.3节中使用ng-content投影过去的复杂组件，我们需要使用代码操作它该怎么做呢？

使用@ContentChild装饰器可以获取到被投影的组件的实例

首先父组件中使用子组件，并投影另一个组件：

然后再子组件中通过ng-content，使用select设置一个占位，以备投影：

在投影进去的组件中导入ContentChild等必要模块。

然后使用@ContentChild()装饰器，声明一个需要使用的被投影的组件的实例。

既然已经获得了投影进来的content的实例，那么然后我们可以在content相关的一些钩子中使用它，比如ngAfterContentInit()钩子。

运行项目可以看到，调用的方法是先调用的（弹窗先出现了），这个与钩子的执行顺序有关：
- content相关的钩子是从父层向子层依次调用
- view相关的钩子是从子层向父层依次执行

也可以直接订阅被投影的子组件中分派的事件：

也是可以响应的：

使用@ContentChildren装饰器，可以获取被投影的多个组件的QueryList实例

在投影进去的组件中导入ContentChildren、QueryList等必要模块。
然后使用@ContentChildren()装饰器，声明一个QueryList类型的实例，其中包含了各个被投影的子组件。然后同样可以在content相关的钩子，对QueryList实例进行遍历，获取到每个子组件实例：

首先投影多个子组件：

然后再投影到的组件中声明QueryList对象，存储各个被投影的子组件实例：

最后，可以遍历这个list，对各个子组件中的emitter进行订阅：

实际效果：

使用@ViewChild()和@ViewChildren()装饰器

ViewChild和ViewChildren的使用方式与ContentChild和ContentChildren的使用方式类似。只是不需要ng-conetnt的投影过程。

html的引用子组件的方法：

在组件类的TS文件中添加上对应的组件实例声明、使用代码：

关于ViewChild和ViewChildren的使用，使用Type类型和string类型的选择器进行视图查询的方法，这里有篇博客：
https://segmentfault.com/a/1190000008695459