event-thumbnail.component.ts event-list.component.ts file app.module.ts file
Category: Angular Component
Component, block, angular block. Decorator that marks a class as an Angular component and provides configuration metadata that determines how the component should be processed, instantiated, and used at runtime.
Angular Component Interaction – Input Decorator
app.module.ts file app.component.html file app.component.ts file child.component.html file child.component.ts file
Inter Component Interaction Way
Input() Decorator Output() Decorator Getters and Setters ngOnChanges() Template Reference Variables ViewChild() Emitting events Services
Angular Component Interaction – Binding
Binding is basic form of interaction between the component class and it’s corresponding template Step 1: for new project creation Step 2: For project running follow this command app.module.ts file app.component.ts file app.component.html file
Using Template Variables to Interact with Child Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file
Communicating with Parent Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file
Communicating with Child-Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file