>  기사  >  Java  >  [ASP.NET MVC 매버릭스 로드]12

[ASP.NET MVC 매버릭스 로드]12

黄舟
黄舟원래의
2016-12-30 16:22:161286검색

[ASP.NET
MVC Mavericks Road] 12 - 섹션, 부분 뷰 및 하위 액션

간단히 말해서 뷰의 콘텐츠는 정적 부분과 동적 부분으로 나눌 수 있습니다. 정적 콘텐츠는 일반적으로 html 요소인 반면, 동적 콘텐츠는 애플리케이션이 실행될 때 동적으로 생성되는 콘텐츠를 나타냅니다. View에 동적 콘텐츠를 추가하는 방법은 다음과 같이 요약할 수 있습니다.

인라인 코드, if 및 foreach 문과 같은 작은 코드 조각.
뷰 모델, ViewBag 등과 같은 단일 또는 다중 HTML 요소를 생성하는 데 사용되는 HTML 도우미 메서드
섹션에서는 생성된 콘텐츠의 일부를 지정된 위치에 삽입합니다.
부분 보기는 별도의 보기 파일에 존재하며 여러 보기에서 하위 콘텐츠로 공유할 수 있습니다.
하위 작업은 비즈니스 로직이 포함된 UI 구성 요소와 동일합니다. 하위 작업이 사용되면 컨트롤러의 작업을 호출하여 뷰를 반환하고 결과를 출력 스트림에 삽입합니다.

이 분류는 절대적인 것은 아닙니다. 처음 두 개는 매우 간단하며 이전 기사에서 사용되었습니다. 이 기사에서는 후자의 세 가지 방법의 적용을 주로 소개합니다.

목차


섹션

Razor 뷰 엔진은 필요한 경우 재사용을 위해 뷰의 콘텐츠 일부를 분리하여 코드를 줄입니다. 중복성. 섹션을 사용하는 방법을 보여드리겠습니다.

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 태그 이름을 통해 섹션을 정의합니다. 여기에는 머리글과 바닥글이라는 두 개의 섹션이 생성됩니다. 섹션은 읽기 쉽도록 보기 파일의 시작 부분이나 끝 부분에 배치하는 것이 일반적입니다. 아래에서는 /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 메서드를 통해 섹션의 콘텐츠를 호출하고 매개변수는 부분. 프로그램을 실행하면 다음과 같은 결과를 볼 수 있습니다.

[ASP.NET MVC 매버릭스 로드]12

섹션은 현재 뷰나 해당 레이아웃에서만 호출할 수 있습니다. @RenderSection 메소드는 매개변수에 지정된 섹션을 찾지 못하면 예외를 발생시킵니다. 섹션이 존재하는지 확실하지 않은 경우 다음과 같이 두 번째 매개변수의 값을 false로 지정해야 합니다.

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

다음과 같이 IsSectionDefined 메서드를 사용할 수도 있습니다.

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


부분 보기

부분 보기는 부분 Razor이며 Html 태그는 다른 위치에서 재사용할 수 있도록 별도의 보기 파일에 배치됩니다. 다음으로 부분뷰 사용법을 소개하겠습니다.

먼저 부분 뷰를 만들어 보겠습니다. /Views/Shared 디렉터리에 MyPartial이라는 새 보기 파일을 생성하고 다음과 같이 "부분 보기로 생성"을 선택합니다.

[ASP.NET MVC 매버릭스 로드]12

추가된 부분 보기 파일은 빈 파일입니다. , 이 파일에 다음 코드를 추가합니다.

<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 메서드는 View 콘텐츠를 동적으로 로드하는 (Html ​​도우미) 방법이기도 합니다.

그런 다음 HomeController에 다음과 같이 List 작업 메서드를 추가합니다.

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

이를 위해 List.cshtml 보기를 계속 추가하고 렌더링하려는 @Html.Partial 메서드를 호출합니다. 다음과 같은 부분 보기:

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

보기 엔진은 /Views/Home 및 /Views/Shared 폴더에서 MyPartial 보기를 지정된 순서로 검색합니다.

프로그램을 실행하고 /Home/List로 이동하면 다음과 같은 효과를 볼 수 있습니다.

[ASP.NET MVC 매버릭스 로드]12

부분 보기와 부분 보기 사용에는 차이가 없습니다. 일반 보기 및 강력한 입력을 사용할 수 있습니다. 예를 들어 MyPartial.cshtml에서 @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>This is the /Views/Home/List.cshtml View</h3>
@Html.Partial("MyPartial", new[] { "Apple", "Orange", "Pear" })

위와 차이점은 여기서는 @Html.Partial에 대한 두 번째 매개 변수를 지정하고 MyPartial.cshtml의 모델 개체에 배열을 전달한다는 것입니다. 실행 효과는 다음과 같습니다.

[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으로 문의하세요.