The @model Directive

The page model class, i.e. the data and methods that hold the functionality associated with a view page, is made available to the view page via the @model directive.

By specifying the model in the view page, Razor exposes a Model property for accessing the model passed to the view page. We can then access properties and functions from that model by using the keyword Model or render its property values on the browser by prefixing the property names with @Model, e.g. @Model.PropertyName.

@page
@model PersonModel
 
// Rendering the value of FirstName in PersonModel
<p>@Model.FirstName</p>
 
<ul>
 // Accessing the value of FavoriteFoods in PersonModel
 @foreach (var food in Model.FavoriteFoods)
 {
  <li>@food</li>
 }
</ul>