MVC4视图

编写一个视图显示列表信息实例。

1、添加数据，通过ViewBag属性在视图中遍历数据。
控制器中代码如下

public ActionResult List() {
var albums = new List<Album>();
for(int i = 0; i < 10; i++) {
albums.Add(new Album {Title = "Product " + i});
}
ViewBag.Albums = albums;
return View();
}

视图部分代码

<ul>
@foreach (Album a in (ViewBag.Albums as IEnumerable<Album>)) {
<li>@a.Title</li>
}
</ul>

也可以通过动态数据的方式，但会失去智能感知

<ul>
@foreach (dynamic p in ViewBag.Albums) {
<li>@p.Title</li>
}
</ul>

在控制器中以模型的方式返回到视图中

public ActionResult List() {
var albums = new List<Album>();
for (int i = 0; i < 10; i++) {

albums.Add(new Album {Title = "Album " + i});
}
return View(albums);
}

引入模型数据类型方式。

@model IEnumerable<MvcApplication1.Models.Album>
<ul>
@foreach (Album p in Model) {
<li>@p.Title</li>
}
</ul>

用using引入模型，定义数据模型类型，与上一中方式结果相同。

@using MvcApplication1.Models
@model IEnumerable<Album>
<ul>
@foreach (Album p in Model) {
<li>@p.Title</li>
}
</ul>

视图中写C#代码

@{
// this is a block of code. For demonstration purposes,
// we'll create a "model" inline.
var items = new string[] {"one", "two", "three"};
}
<html>
<head><title>Sample View</title></head>
<body>
<h1>Listing @items.Length items.</h1>
<ul>
@foreach(var item in items) {
<li>The item name is @item.</li>
}

</ul>
</body>
</html>

@使用

<li>Item_@item.Length</li>

<li>Item_@(item.Length)</li>

<p>
You should follow
@@haacked, @@jongalloway, @@bradwilson, @@odetocode
</p>

HTML Encoding防止脚本注入，html编码

@{
string message = "<script>alert('haacked!');</script>";
}
<span>@message</span>

编码后的html代码

<span>&lt;script&gt;alert(&#39;haacked!&#39;);&lt;/script&gt;</span>

通过RAW进行解码

@{
string message = "<strong>This is bold!</strong>";
}
<span>@Html.Raw(message)</span>

解码后的HTML

<span><strong>This is bold!</strong></span>

HTML编码自动减轻XSS漏洞,通过编码用户输入要显示为HTML,但它在JavaScript不能解析。

<script type="text/javascript">
$(function () {
var message = 'Hello @ViewBag.Username';
$("#message").html(message).show('slow');
});
</script>

可以通过@Ajax.JavaScriptStringEncode(ViewBag.Username)

<script type="text/javascript">
$(function () {
var message = 'Hello @Ajax.JavaScriptStringEncode(ViewBag.Username)';
$("#message").html(message).show('slow');
});
</script>

Code Blocks代码块

@foreach(var item in stuff) {
<li>The item name is @item.</li>
}

@foreach(var item in stuff) {<li>The item name is @item.</li>}

<% foreach(var item in stuff) { %>
<li>The item name is <%: item %>.</li>
<% } %>

@{
string s = "One line of code.";
ViewBag.Title "Another line of code";
}

@{Html.RenderPartial("SomePartial");}

视图语法例子

隐式代码表达式

Razor <span>@model.Message</span>
Web Forms <span><%: model.Message %></span>
显示代码表达式

RAZOR <span>ISBN@(isbn)</span>
Web Forms <span>ISBN<%: isbn %></span>

Razor <span>@Html.Raw(model.Message)</span>
Web Forms <span><%: Html.Raw(model.Message) %></span>
or
<span><%= model.Message %></span>

代码块

Razor @{
int x = 123;
string y = ˝because.˝;
}
Web Forms <%
int x = 123;
string y = "because.";
%>

结合文本标记

Razor @foreach (var item in items) {
<span>Item @item.Name.</span>
}
Web Forms <% foreach (var item in items) { %>
<span>Item <%: item.Name %>.</span>
<% } %>

混合代码和纯文本

Razor @if (showMessage) {
<text>This is plain text</text>
}
or
@if (showMessage) {
@:This is plain text.
}
Web Forms <% if (showMessage) { %>
This is plain text.
<% } %>

转义代码分隔符

Razor My Twitter Handle is @haacked
or
My Twitter Handle is @@haacked
Web Forms <% expression %> marks a code
nugget.

注释代码

Razor @*
This is a multiline server side comment.
@if (showMessage) {
<h1>@ViewBag.Message</h1>
}
All of this is commented out.
*@
Web Forms <%--
This is a multiline server side comment.
<% if (showMessage) { %>
<h1><%: ViewBag.Message %></h1>
<% } %>
All of this is commented out.
--%>

调用泛型方法

Razor @(Html.SomeMethod<AType>())
Web Forms <%: Html.SomeMethod<AType>() %>