Quando mettiamo in binding una proprietà di un component con un frammento di HTML, stiamo generando HTML con il valore della proprietà. Questo semplice processo può essere intercettato per personalizzare come la proprietà viene poi rappresentata nel codice HTML.
Un classico esempio di personalizzazione dell'output di una proprrietà è quando si ha a che fare con le date. In questi casi la proprietà del component è di tipo Date, ma sicuramente nel codice HTML vogliamo una stringa con la data formattata. Per poter formattare l'output dobbiamo utilizzare una Pipe e nel caso delle date ne abbiamo già una offerta da Angular 2: Date. L'utilizzo di questa Pipe è molto semplice come si evince dall'esempio:
import { Component } from '@angular/core'; @Component({ selector: 'DateComponent', template: `<p>The date is {{ Value | date }}</p>` }) export class DateComponent { Value = new Date(1979, 3, 11); }
Una Pipe si esprime inserendo un carattere "|" dopo l'espressione di binding e aggiungendo poi il nome della classe che rappresenta la Pipe (date in questo caso).
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Aprire una finestra di dialogo per selezionare una directory in WPF e .NET 8
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Definire stili a livello di libreria in Angular
Utilizzare politiche di resiliency con Azure Container App
Generare la software bill of material (SBOM) in GitHub
Aggiungere interattività lato server in Blazor 8
Come migrare da una form non tipizzata a una form tipizzata in Angular
Utilizzare Azure Cosmos DB con i vettori
Utilizzare i primary constructor di C# per inizializzare le proprietà
Migliorare l'organizzazione delle risorse con Azure Policy
Hosting di componenti WebAssembly in un'applicazione Blazor static
I più letti di oggi
- Effettuare il log delle chiamate a function di GPT in ASP.NET Web API
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Utilizzare il metodo CountBy di LINQ per semplificare raggruppamenti e i conteggi
- Creare una libreria CSS universale: Cards
- Eseguire script pre e post esecuzione di un workflow di GitHub