Nello script #167 abbiamo visto come creare un Component per Angular 2. Rispetto ad AngularJS 1.x, la gestione degli eventi dal DOM verso il nostro codice è leggermente differente.
In Angular 2 viene utilizzata la notazione con parentesi all'interno del template e viene invocato un metodo definito all'interno della classe che rappresenta il component.
@Component({ ... }) export class MyComponent { constructor() { } clicked(event) { alert('click del pulsante'); } }
All'interno del template avremo poi questo pezzo di markup:
<button (click)="clicked($event)">Click</button>
Nel codice del template, andremo ad intercettare l'evento click, invocando il metodo clicked definito all'interno del nostro component.
Se volessimo catturare l'evento, è sufficiente passare $event, come nel nostro caso, così da poter, da esempio, bloccare la propogazione dell'evento:
clicked(event) { event.preventDefault(); // blocchiamo la propagazione dell'evento alert('click del pulsante'); }
Per approfondimenti:
#167 - Creare un component con Angular 2
https://www.html5italia.com/script/167/Creare-Component-Angular.aspx
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Sfruttare GPT-4o realtime su Azure Open AI per conversazioni vocali
Documentare i servizi REST con Swagger e OpenAPI con .NET 9
Utilizzare EF.Constant per evitare la parametrizzazione di query SQL
Change tracking e composition in Entity Framework
Utilizzare i variable font nel CSS
Ottimizzazione dei block template in Angular 17
Paginare i risultati con QuickGrid in Blazor
Bloccare l'esecuzione di un pod in mancanza di un'artifact attestation di GitHub
Fornire parametri ad un Web component HTML
Managed deployment strategy in Azure DevOps
Potenziare la ricerca su Cosmos DB con Full Text Search
Eseguire una ricerca avanzata per recuperare le issue di GitHub