puddlejumper26 / blogs

Personal Tech Blogs
4 stars 1 forks source link

@ Input & @ output in Angular #52

Open puddlejumper26 opened 4 years ago

puddlejumper26 commented 4 years ago

Input marks a class field as an input property and supplies configuration metadata. The input property is bound to a DOM property in the template.

During change detection, Angular automatically updates the data property with the DOM property's value.

@Input() and @Output() allow Angular to share data between the parent context and child directives or components.

An @Input() property is writable while an @Output() property is observable.

Think of @Input() and @Output() like ports or doorways—@Input() is the doorway into the component allowing data to flow in while @Output() is the doorway out of the component, allowing the child component to send data out.

Reference

[1] https://angular.io/api/core/Input [2] https://angular.io/guide/template-syntax#input-and-output-properties