搜尋
首頁Javajava教程[ASP.NET MVC 小牛之路]12

[ASP.NET MVC 小牛之路]12

Dec 30, 2016 pm 04:22 PM
asp.netmvc

[ASP.NET
MVC 小牛之路]12 - Section、Partial View 和 Child Action

概括的講,View中的內容可以分為靜態和動態兩部分。靜態內容一般是html元素,而動態內容指的是在應用程式運行的時候動態創建的內容。在View中加入動態內容的方式可歸納為以下幾種:

Inline code,小的程式碼片段,如 if 和 foreach 語句。
Html helper方法,用來產生單一或多個HTML元素,如view model、ViewBag等。
Section,在指定的位置插入創建好的部分內容。
Partial view,存在於一個單獨的視圖檔案中,作為子內容可在多個視圖中共用。
Child action,相當於一個包含了業務邏輯的UI元件。當使用child action時,它會呼叫 controller 中的 action 來傳回一個view,並將結果插入到輸出流中。

這個分類不是絕對的。前兩種很簡單,在前面的文章也使用過。本文主要介紹後三種方式的應用。

本文目錄


Section

Razor視圖引擎支援將View中的一部分內容分離出來,以便在需要的地方重複利用,減少了程式碼的冗餘。下面來示範如何使用Section。

建立一個MVC應用程序,選擇基本模板。新增一個HomeController,編輯產生的Index方法如下:

public ActionResult Index() {
    string[] names = { "Apple", "Orange", "Pear" };
    return View(names);
}

右擊Index方法,新增視圖,編輯該視圖如下:

@model string[] 
 
@{ 
    ViewBag.Title = "Index"; 
} 
 
@section Header { 
    <div class="view"> 
        @foreach (string str in new [] {"Home", "List", "Edit"}) { 
            @Html.ActionLink(str, str, null, new { style = "margin: 5px" })   
        } 
    </div> 
}

<div class="view"> 
    This is a list of fruit names: 
    @foreach (string name in Model) { 
        <span><b>@name</b></span> 
    } 
</div>@section Footer { 
    <div class="view"> 
        This is the footer 
    </div> 
}

我們透過@section標籤加section的名稱來定義一個Section,這裡建立了兩個section :Header 和Footer,習慣上一般把section放在View檔案的開頭或結尾方便閱讀。下面我們在 /Views/Shared/_Layout.cshtml 檔案中來使用它們。

編輯 /Views/Shared/_Layout.cshtml 檔案如下:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <style type="text/css"> 
        div.layout { background-color: lightgray;} 
        div.view { border: thin solid black; margin: 10px 0;} 
    </style> 
    <title>@ViewBag.Title</title> 
</head> 
<body>
    @RenderSection("Header") 
 
    <div class="layout"> 
        This is part of the layout 
    </div> 
 
    @RenderBody() 
 
    <div class="layout"> 
        This is part of the layout 
    </div>

    @RenderSection("Footer")
<div class="layout"> 
        This is part of the layout 
    </div> 
</body> 
</html>

我們透過 @RenderSection 方法來呼叫section的內容,參數指定了section的名稱。執行程式後可以看到以下結果:

[ASP.NET MVC 小牛之路]12

注意,section只能在目前View或它的Layout中被呼叫。 @RenderSection方法沒有找到參數指定的section會拋異常,如果不確定section是否存在,則需要指定第二個參數的值為false,如下:

... 
@RenderSection("scripts", false) 
...

我們也可以透過IsSectionDefined 方法來判斷一個section是否被定義或在目前View中是否能調用得到,如:

... 
@if (IsSectionDefined("Footer")) { 
    @RenderSection("Footer") 
} else { 
    <h4 id="This-nbsp-is-nbsp-the-nbsp-default-nbsp-footer">This is the default footer</h4>    
} 
...


Partial View

Partial view(分部視圖)是將部分Razor 和Html 標籤放在一個獨立的視圖文件中,以便在不同的地方重複利用。接下來介紹如何使用 partial view。

我們先來建立一個partial view 。在/Views/Shared 目錄下新建一個名為MyPartial 的視圖文件,勾選“創建為分部視圖”,如下:

[ASP.NET MVC 小牛之路]12

添加好的partial view 文件是一個空文件,我們在這個文件中添加如下程式碼:

<div>
    This is the message from the partial view.
    @Html.ActionLink("This is a link to the Index action", "Index")
</div>

這個MyPartial.cshtml 視圖用將建立一個回到首頁的連線。當然這裡的 @Html.ActionLink 方法也是一種(Html helper)動態載入View內容的方式。

然後在HomeController 中加入一個List action方法,如下:

public ActionResult List()
{
    return View();
}

繼續為此新增一個List.cshtml 視圖,並透過@Html.Partial方法來呼叫我們要呈現的分部視圖,如下:

@{
    ViewBag.Title = "List";
    Layout = null;
}
<h3 id="This-nbsp-is-nbsp-the-nbsp-Views-Home-List-cshtml-nbsp-View">This is the /Views/Home/List.cshtml View</h3>
@Html.Partial("MyPartial")

視圖引擎將依照規定的順序先後在/Views/Home 和/Views/Shared 資料夾下尋找MyPartial 視圖。

運行程序導航到/Home/List,我們可以看到如下效果:

[ASP.NET MVC 小牛之路]12

Partial view 和普通和View 的使用沒有什麼區別,也可以使用強類型,如我們在MyPartial.cshtml 中通過@ model 指定model 的類型:

@model IEnumerable<string>

<div>
    This is the message from the partial view.
    @Html.ActionLink("This is a link to the Index action", "Index")
    
    <ul>
        @foreach (string str in Model)
        {
            <li>@str</li>
        }
    </ul>
</div>

並修改呼叫MyPartial.cshtml 視圖的主視圖List.cshtml 如下:

@{
    ViewBag.Title = "List";
    Layout = null;
}
<h3 id="This-nbsp-is-nbsp-the-nbsp-Views-Home-List-cshtml-nbsp-View">This is the /Views/Home/List.cshtml View</h3>
@Html.Partial("MyPartial", new[] { "Apple", "Orange", "Pear" })

和上面不同的是,這裡我們給@Html.Partial 指定了第二個參數,將一個數組傳遞給了MyPartial.cshtml 的model 物件。運作效果如下:

[ASP.NET MVC 小牛之路]12

Child Action

Child action 和 Patial view 类似,也是在应用程序的不同地方可以重复利用相同的子内容。不同的是,它是通过调用 controller 中的 action 方法来呈现子内容的,并且一般包含了业务的处理。任何 action 都可以作为子 action 。接下来介绍如何使用它。

在 HomeController 中添加一个 action,如下:

[ChildActionOnly]
public ActionResult Time()
{
    return PartialView(DateTime.Now);
}

这个 action 通过调用 PartialView 方法来返回一个 partial view。ChildActionOnly 特性保证了该 action 只能作为子action被调用(不是必须的)。

接着我们继续为这个action添加一个相应的 Time.cshtml 视图,代码如下:

@model DateTime

<p>The time is: @Model.ToShortTimeString()</p>


在 List.cshtml 视图中添加如下代码来调用 Time action 方法 :
...
@Html.Action("Time")

运行结果如下:

[ASP.NET MVC 小牛之路]12

我们通过 @Html.Action 方法来调用了 Time action 方法来呈现子内容。在这个方法中我们只传了一个action名称参数,MVC将根据当前View所在Controller去查找这个action。如果是调用其它 controller 中的 action 方法,则需要在第二个参数中指定 controller 的名称,如下:

... 
@Html.Action("Time", "MyController")

该方法也可以给 action 方法的参数传值,如对于下面带有参数的 action:

... 
[ChildActionOnly] 
public ActionResult Time(DateTime time) { 
    return PartialView(time); 
}
我们可以这样使用 @Html.Action 方法:
... 
@Html.Action("Time", new { time = DateTime.Now })

 以上就是[ASP.NET MVC 小牛之路]12 的内容,更多相关内容请关注PHP中文网(www.php.cn)!


陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
說明JVM如何充當Java代碼和基礎操作系統之間的中介。說明JVM如何充當Java代碼和基礎操作系統之間的中介。Apr 29, 2025 am 12:23 AM

JVM的工作原理是將Java代碼轉換為機器碼並管理資源。 1)類加載:加載.class文件到內存。 2)運行時數據區:管理內存區域。 3)執行引擎:解釋或編譯執行字節碼。 4)本地方法接口:通過JNI與操作系統交互。

解釋Java虛擬機(JVM)在Java平台獨立性中的作用。解釋Java虛擬機(JVM)在Java平台獨立性中的作用。Apr 29, 2025 am 12:21 AM

JVM使Java實現跨平台運行。 1)JVM加載、驗證和執行字節碼。 2)JVM的工作包括類加載、字節碼驗證、解釋執行和內存管理。 3)JVM支持高級功能如動態類加載和反射。

您將採取哪些步驟來確保Java應用程序在不同的操作系統上正確運行?您將採取哪些步驟來確保Java應用程序在不同的操作系統上正確運行?Apr 29, 2025 am 12:11 AM

Java應用可通過以下步驟在不同操作系統上運行:1)使用File或Paths類處理文件路徑;2)通過System.getenv()設置和獲取環境變量;3)利用Maven或Gradle管理依賴並測試。 Java的跨平台能力依賴於JVM的抽象層,但仍需手動處理某些操作系統特定的功能。

Java是否需要特定於平台的配置或調整區域?Java是否需要特定於平台的配置或調整區域?Apr 29, 2025 am 12:11 AM

Java在不同平台上需要進行特定配置和調優。 1)調整JVM參數,如-Xms和-Xmx設置堆大小。 2)選擇合適的垃圾回收策略,如ParallelGC或G1GC。 3)配置Native庫以適應不同平台,這些措施能讓Java應用在各種環境中發揮最佳性能。

哪些工具或庫可以幫助您解決Java開發中特定於平台的挑戰?哪些工具或庫可以幫助您解決Java開發中特定於平台的挑戰?Apr 29, 2025 am 12:01 AM

Osgi,Apachecommonslang,JNA和JvMoptionsareeForhandlingForhandlingPlatform-specificchallengesinjava.1)osgimanagesdeppedendendencenciesandisolatescomponents.2)apachecommonslangprovidesitorityfunctions.3)

JVM如何在不同平台上管理垃圾收集?JVM如何在不同平台上管理垃圾收集?Apr 28, 2025 am 12:23 AM

JVMmanagesgarbagecollectionacrossplatformseffectivelybyusingagenerationalapproachandadaptingtoOSandhardwaredifferences.ItemploysvariouscollectorslikeSerial,Parallel,CMS,andG1,eachsuitedfordifferentscenarios.Performancecanbetunedwithflagslike-XX:NewRa

為什麼Java代碼可以在不同的操作系統上運行,而無需修改?為什麼Java代碼可以在不同的操作系統上運行,而無需修改?Apr 28, 2025 am 12:14 AM

Java代碼可以在不同操作系統上無需修改即可運行,這是因為Java的“一次編寫,到處運行”哲學,由Java虛擬機(JVM)實現。 JVM作為編譯後的Java字節碼與操作系統之間的中介,將字節碼翻譯成特定機器指令,確保程序在任何安裝了JVM的平台上都能獨立運行。

描述編譯和執行Java程序的過程,突出平台獨立性。描述編譯和執行Java程序的過程,突出平台獨立性。Apr 28, 2025 am 12:08 AM

Java程序的編譯和執行通過字節碼和JVM實現平台獨立性。 1)編寫Java源碼並編譯成字節碼。 2)使用JVM在任何平台上執行字節碼,確保代碼的跨平台運行。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器