MVC 框架 - 视图

正如在最初的介绍性章节中所看到的，视图是与应用程序的用户界面相关的组件。这些视图通常从模型数据绑定，并具有 html、aspx、cshtml、vbhtml 等扩展名。在我们的第一个 MVC 应用程序中，我们使用带有控制器的视图来向最终用户显示数据。为了将这些静态和动态内容渲染到浏览器，MVC 框架利用视图引擎。视图引擎基本上是标记语法实现，负责将最终的 HTML 渲染到浏览器。

MVC 框架带有两个内置视图引擎 -

Razor Engine - Razor 是一种标记语法，可将服务器端 C# 或 VB 代码添加到网页中。此服务器端代码可用于在加载网页时创建动态内容。Razor 相对于 ASPX 引擎来说是一个先进的引擎，在 MVC 的后续版本中推出。

ASPX 引擎- ASPX 或 Web 表单引擎是默认视图引擎，从一开始就包含在 MVC 框架中。使用此引擎编写代码类似于在 ASP.NET Web 窗体中编写代码。

以下是比较 Razor 和 ASPX 引擎的小代码片段。

剃刀

@Html.ActionLink("Create New", "UserAdd")

ASPX

<% Html.ActionLink("SignUp", "SignUp") %>

在这两者中，Razor 是一种先进的视图引擎，因为它具有紧凑的语法、测试驱动的开发方法和更好的安全功能。我们将在所有示例中使用 Razor 引擎，因为它是最常用的视图引擎。

这些视图引擎可以通过以下两种类型进行编码和实现：

强类型
动态类型

这些方法分别类似于早期绑定和后期绑定，其中模型将强烈或动态地绑定到视图。

强类型视图

为了理解这个概念，让我们创建一个示例 MVC 应用程序（按照前面章节中的步骤操作）并添加一个名为ViewDemoController的控制器类文件。

现在，将以下代码复制到控制器文件中 -

using System.Collections.Generic; 
using System.Web.Mvc;  

namespace ViewsInMVC.Controllers { 
   
   public class ViewDemoController : Controller { 
      
      public class Blog { 
         public string Name; 
         public string URL; 
      }  
      
      private readonly List topBlogs = new List { 
         new Blog { Name = "Joe Delage", URL = "http://tutorialspoint/joe/"}, 
         new Blog {Name = "Mark Dsouza", URL = "http://tutorialspoint/mark"}, 
         new Blog {Name = "Michael Shawn", URL = "http://tutorialspoint/michael"} 
      };  
      
      public ActionResult StonglyTypedIndex() { 
         return View(topBlogs); 
      }  
      
      public ActionResult IndexNotStonglyTyped() { 
         return View(topBlogs); 
      }   
   } 
}

在上面的代码中，我们定义了两个操作方法：StronglyTypedIndex和IndexNotStonglyTyped。我们现在将为这些操作方法添加视图。

右键单击 StonglyTypedIndex 操作方法，然后单击添加视图。在下一个窗口中，选中“创建强类型视图”复选框。这也将启用模型类和支架模板选项。从支架模板选项中选择列表。单击添加。

将创建类似于以下屏幕截图的视图文件。您可以注意到，它在顶部包含了 ViewDemoController 的 Blog 模型类。通过这种方法，您还可以在代码中使用 IntelliSense。

动态类型视图

要创建动态类型化视图，请右键单击 IndexNotStonglyTyped 操作，然后单击添加视图。

这次，不要选中“创建强类型视图”复选框。

结果视图将具有以下代码 -

@model dynamic 
            
@{ 
   ViewBag.Title = "IndexNotStonglyTyped"; 
}

<h2>Index Not Stongly Typed</h2>  
<p> 
   <ul> 
      
      @foreach (var blog in Model) { 
         <li> 
            <a href = "@blog.URL">@blog.Name</a> 
         </li>    
      } 
   
   </ul> 
</p>

正如您在上面的代码中看到的，这次它没有像之前的情况一样将 Blog 模型添加到 View 中。另外，这次您将无法使用 IntelliSense，因为这次绑定将在运行时完成。

强类型视图被认为是一种更好的方法，因为我们已经知道什么数据作为模型传递，这与动态类型视图不同，在动态类型视图中，数据在运行时绑定，如果链接模型中发生某些变化，可能会导致运行时错误。