-
What are razor pages? How do we identify them?
Developed for .NET Core 2.0 and above, Razor Pages are a newer, simplified web application programming model a view (Index.cshtml) coupled with a page model (Index.cshtml.cs) much like classic asp webforms of years ago.
The Razor page inherits from PageModel class and displays its content directly in the UI using the @model directive of which their can only be one.
Razor pages are enabled in the Startup.cs file by adding the service.AddRazorPages() service command and the file-based routing is established in the end points of the Configure method under this same Startup.cs file.
-
How do we add the ability to refresh a Razor page and instantly see our UI changes without having to start/stop the application?
- We can first add the necessary library:
- install-package Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation
and then ConfigureServices of StartUp.cs, we modify the service to allow for both Razor Pages and for runtime compilations:
services.AddRazorPages().AddRazorRuntimeCompilation();
-
Write a Razor page that processes a lead page with red error handling.
jQuery1124011107394323192676_1606936824977?
-
Write two links using Razor syntax.
jQuery1124021924190787449316_1606941103399?
-
Show how to create and use a partial view page.
We create the page like all other Razor page except we use the underscore at the beginning of the file name, (ie, _PartialViewStuff).
- We can then call it elsewhere using the syntax,
- <partial name="_PartialViewStuff" />
-
What are the common types of directives in a Razor page?
-
Do Razor pages support dependency injection? If so, how?
Yes. They do this by inheriting from the PageModel class of every Razor page.
-
Add a message property to the Page model that says, "hello world." and then use that property in the Razor page.
- // create our message property
- public string Message { get; set; }
- in our Index or OnGet() method, we set our value
- Message = "hello world.";
- in our view, we call this property,
- @Model.Message()
-
(a) Write a Razor link with a controller, action, and parameter value.
(b) Write a Razor link for a page
(c) Write a Razor link for a URL
(d) Write a Razor link for an area
(a) <a asp-controller="Home" asp-action="Detail" asp-route-id="@Model.SpeakerId">SpeakerId: @Model.SpeakerId</a>
(b) <a asp-page="/index">Index Page</a>
(c) <a href='www.yahoo.com'>Yahoo!</a>
(d) <a asp-area="Admin" asp-controller="Home" asp-action="Register">Register</a>
-
Write a Razor div table using tag helpers for car details make, model, and description.
- <div>
- <h4>Car</h4>
- <hr />
- <dt>@Html.DisplayNameFor(model => model.Car.Make</dt>
- <dd>@Html.DisplayFor(model => model.Car.Make)</dd>
- <dt>@Html.DisplayNameFor(model => model.Car.Model</dt>
- <dd>@Html.DisplayFor(model => model.Car.Model)</dd>
- <dt>@Html.DisplayNameFor(model => model.Car.Description</dt>
- <dd>@Html.DisplayFor(model => model.Car.Description</dd>
- </div>
-
Write a foreach loop on a Razor page that displays tag helper for movies in a list with Title, ReleaseDate, Price, and Edit | Details | Delete link for each record.
- @foreach (var item in Model.Movie) {
- <tr>
- <td>
- @Html.DisplayFor(modelItem => item.Title)
- </td>
- <td>
- @Html.DisplayFor(modelItem => item.ReleaseDate)
- </td>
- <td>
- @Html.DisplayFor(modelItem => item.Price)
- </td>
- <td>
- <a asp-page="./Edit" asp-route-id="@item.ID">Edit</a> |
- <a asp-page="./Details" asp-route-id="@item.ID">Details</a> |
- <a asp-page="./Delete" asp-route-id="@item.ID">Delete</a>
- </td>
- </tr>
- }
-
Write the endpoint map controller routing for standard route pages. Where is this located?
Located in the StartUp.cs file under Configuration method.
- endpoints.MapControllerRoute(
- name: "default",
- pattern: "{controller=Home}/{action=Index}/{id?}");
-
Write 3 directives which import an internal class, one which imports a routing model, and one which imports tag helpers.
- @using MySolution.MyProject.Data.Entities.Book
- @using RoutingAspNetCoreDemo.Endpoints.Models
- @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
-
How do we add entity framework scaffolding to a Razor page?
Scaffolding is microsoft's naming convention to add basic entity framework CRUD operations using the UI rather than creating those methods by hand. We simply right-click over a POCO class and choose Add Scaffolding Item and select 'Razor Pages using Entity Framework (CRUD)' option. In the dialog, select our model/entity (ie, Book, Video) followed by our DB context class (ie, AppDbContext). Select OK and the application will build out our CRUD operations.
-
What is a content page? How do we create one?
Content page is a Razor page with the @page directive as the very first line of the .cshtml file. While content pages can have both client and server side markup just like classic ASP scripting languages had, it is advised to always do as much processing on the server side before sending information to the UI section of the content page.
|
|