angular 8 ngif 指令 组件的输入输出属性

展示图（1）--指令

组件的输入和输出

首先我们要理解@Input和@Output，在这里有一个点我们要注意 EventEmitter 的引入是在@angular/core中，不是在events中

@Input: 一个装饰器，用来把某个类字段标记为输入属性，并提供配置元数据。 该输入属性会绑定到模板中的某个 DOM 属性。当变更检测时，Angular 会自动使用这个 DOM 属性的值来更新此数据属性。

@Output: 一个装饰器，用于把一个类字段标记为输出属性，并提供配置元数据。 凡是绑定到输出属性上的 DOM 属性，Angular 在变更检测期间都会自动进行更新。

展示图（1）--声明类名

这个方法是放在组件上用来将事件通知给父组件

展示图（2）--方法调用

接下来，我们在外部引用这个组件的时候，【menus】是导入的数据，（tabSelected）方法是将当前事件获取到的值通知出去，{ topMenus和headselection是在父组件中声明的数据和方法 }

展示图（3）--组件调用