Angular · Theory
Events: (click), (input), (submit), (keyup.enter). The handler lives on the class. $event is the browser event when you need the value.
Board: <form (ngSubmit)="save($event)">. Call $event.preventDefault() or use ngSubmit so the page doesn’t reload. Trap: (click) on a submit button without preventDefault.
(click) vs ngSubmit. preventDefault.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<h1>{{ title }}</h1>
<button (click)="toggle()">Toggle</button>
<p *ngIf="open">Panel open</p>
`,
})
export class AppComponent {
title = "Angular practice";
open = true;
toggle() {
this.open = !this.open;
}
}Events: toggle open. Say whether the panel is on screen after one click.