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
Testare l'invio dei messaggi con Event Hubs Data Explorer
Configurare e gestire sidecar container in Azure App Service
Migliorare la scalabilità delle Azure Function con il Flex Consumption
Gestire i dati con Azure Cosmos DB Data Explorer
Anonimizzare i dati sensibili nei log di Azure Front Door
Configurare lo startup di applicazioni server e client con .NET Aspire
Fornire parametri ad un Web component HTML
Rinnovare il token di una GitHub App durante l'esecuzione di un workflow
Creare una libreria CSS universale: Immagini
Rendere i propri workflow e le GitHub Action utilizzate più sicure
Ricevere notifiche sui test con Azure Load Testing
Path addizionali per gli asset in ASP.NET Core MVC
I più letti di oggi
- Usare i settings di serializzazione/deserializzazione di System.Text.Json di ASP.NET all'interno di un'applicazione non web
- .NET Conference Italia 2025 - Milano
- The Agentic Day - Milano
- Gestione ciclo di vita in .NET Aspire
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Gestione CSS in Blazor con .NET 9