Lo scopo di un view engine è fondamentalmente quello di consentirci di integrare markup HTML e codice, così che possiamo descrivere la logica secondo cui una pagina web dinamica debba essere generata. Tipicamente, questo compito viene assolto distinguendo i due mondi, ossia quello dei tag e quello degli statement C# o Visual Basic grazie a speciali tag, che servono quindi a individuare i punti in cui avviene il cosiddetto context switching.
In Razor, questo context switching avviene grazie al carattere @, tramite cui possiamo identificare intere porzioni di codice semplicemente includendole all'interno di un blocco @{ ... } nel caso di C#, o @Code ... End Code in Visual Basic:
@{ string myString = "La mia prima pagina Razor"; string myInt = 14; }
@Code Dim myString as String = "La mia prima pagina Razor" Dim myInt as Integer = 14 End Code
Avendo delimitato in questo modo la porzione di testo contenente il vero e proprio codice (nell'esempio precedente, la dichiarazione di due variabili), siamo in grado di integrare nello stesso file anche del markup HTML, senza dover prendere alcun accorgimento particolare:
@{ // .. codice qui .. } <html> <body> <h1>Questo è un header</h1> </body> </html>
All'interno del codice HTML, possiamo poi effettuare, quando vogliamo, un nuovo context switching, ad esempio per popolare dinamicamete il tag H1 in base al contenuto della variabile myString, riutilizzando il carattere @.
@{ string myString = "La mia prima pagina Razor"; } <h1>@myString</h1>
Come possiamo notare, nel caso in cui il codice sia inline, occupi cioé una sola riga, non è necessario definire esplicitamente i blocchi @{ ... } o @Code ... End Code.
Riferimenti utili
Il nostro speciale su ASP.NET Razorhttps://www.aspitalia.com/focuson/1253/Speciale-Razor-View-Engine-WebMatrix-ASP.NET-MVC.aspx
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Creazione di componenti personalizzati in React.js con Tailwind CSS
Gestire undefined e partial nelle reactive forms di Angular
Eseguire query verso tipi non mappati in Entity Framework Core
Supportare il sorting di dati tabellari in Blazor con QuickGrid
Eseguire una GroupBy per entity in Entity Framework
Utilizzare i primary constructor di C# per inizializzare le proprietà
Personalizzare l'errore del rate limiting middleware in ASP.NET Core
Sostituire la GitHub Action di login su private registry
Ottimizzazione dei block template in Angular 17
Creare form tipizzati con Angular
Disabilitare automaticamente un workflow di GitHub
Utilizzare domini personalizzati gestiti automaticamente con Azure Container Apps