Output

You use the @Output decorator when a component is supposed to notify a parent when something occurs. For this purpose, you use EventEmitter, Angular's events abstraction. Then the parent component can subscribe to these events using event bindings and respond to them.

Let's use @Output in the category menu-related components:

  1. Open category-menu-item.component.ts:
    1. Define an EventEmitter field named selected with an @Output decorator.
    2. Implement a function that emits the event with the same category name as the payload:
import { Component, Input, Output, EventEmitter } from '@angular/core'; @Component({  selector: 'app-category-menu-item',  templateUrl: './category-menu-item.component.html', styleUrls: ['./category-menu-item.component.css'] ...

Get Hands-On Full-Stack Web Development with ASP.NET Core now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.