ASP. Net MVC View (View), asp. netmvc

ASP. Net MVC View (View), asp. netmvc

The View provides the user with an interface. Generate a format interface that is provided to the user based on the provided model data.

Support multiple view engines (Razor and ASPX view engines are officially provided by default. In fact, they also support N other view engines. You can even write a set of view engines on your own)

Data transmission between View and Action (front-end and back-end data transmission)

Weak ViewData [""]

Dynamic ViewBag // dynamic

Dynamic Model
Background: return View (data); // save it to ViewData. Model
Foreground: Model // actually WebViewPage. Model

@ Using namespace

Strong View

// Control Action public ActionResult Index () {return View (new User {UserName = "Guo Jing"}); // ViewData. Model attribute}

// Index. cshtml

@ Model MvcApplication. Models. User

<div>@Model.UserName</div>

Razor view engine syntax

Razor provides a simplified syntax for the view, minimizing the syntax and extra strings

• Razor implements smooth switching between codes and tags by understanding the tag structure.
• @ Core conversion character, used to mark-the conversion string of the Code.

Context:

@ {String schoolName = "Hunan First Normal University ";}

Context B:

Razor engine recognition @ and <> html </>

Razor syntax

The Razor expression automatically uses HTML encoding.

If the source html code is output to the browser, use System. Web. IHtmlString: @ Html. Raw ("<p> zouyujie </p> ")

Output result zouyujuie

Html source code

JS string Encoding

<script>     alert('@Ajax.JavaScriptStringEncode(ViewBag.UserName)');</script>

Result:

@ Code block

@ {String s = "zouyujie"; int age = 26 ;}{ Html. RenderPartial ("TestPartial");} // call the method without return values

Note:@*............*@

Call the generic method:@ (Html. SomeMethod <User> ());

Mixed code and text:

@ If (1 = 1) {<text> I want to output the text here! </Text> @: Here is the output text! }

@ Escape:@@

Operation web built-in objects:@ Request. RawUrl @ Response. Write

@ Combination of scope and html tags:

@ {String userName = "Liu Bang"; <p> @ userName </p>
}

Output unescaped HTML code in @ Scope

1. Use a string to describe the output

@ {String strHtm = "<p> Hello ~ </P> "; @ strHtml}

2. Use HTMLHelper to output

{@ Html. Raw ("<p> wow, haha ~ </P> ");}

3. Use HtmlString class output

@ {HtmlString htm = new HtmlString ("<p> Haha </p>"); @ htm}

4. Use MvcHtmlString to output

@ {Var strHtml = MvcHtmlString. Create ("<p> Haha ~ </P> "); @ strHtml}

Data Type Conversion

Use the As... () method for conversion, for example: @ ("120". AsInt ())

Value Type Determination

Use the IsInt () method, such as @ (strAge. IsInt ()? "Yes": "no ")

Path Conversion

Use the Href () method, for example, @ Href ("~ /Home/Index ");

Using System. Web. WebPages; // many As... methods are extended for strings internally.

HtmlHelper reuse: equivalent to defining methods in the view

@helper List(List<string> dogs){    <ul>        @foreach (string s in dogs)        {            <li>@s</li>        }    </ul>    }@List(new List<string>(){"ruiky","lisa","lucy"})

Razor Layout-overall view Template

Overall application template View

1. @ RenderBody () // placeholder on the template page

2 .@{

Layout = "~ /Views/Shared/SiteLayout. cshtml ";

View. Title = "User List ";

}

<P> all the html code on the subpage is replaced with @ RenderBody () on the template page. </p>

Application overall view template-multiple "placeholders"

3. Multiple sections on the template page:

<Footer> @ RenderSection ("Footer") </footer>

Subpage definition node:

@ Section Footer {<B> WE are also joining! </B>}

Whether the template page is a layout section method, IsSectionDeined

@ If (IsSectionDefined ("Footer") {@ RenderSection ("Footer");} else {<B> "sub-page" No Footer ~ </B>}

Razor Layout-ViewStart

Each child page uses a Layout to specify the Layout. If multiple views use the same layout, redundancy will occur, causing trouble in modification and maintenance.

_ ViewStart. cshtml can solve this problem

The code of this file takes precedence over any view code execution in the same directory and subdirectory.

Automatically added _ ViewStart. cshtml in the View directory

   @{          Layout = "~/Views/Shared/_Layout.cshtml";    } 

With this, you can add the same view layout for all views in a folder.

Because the code of this file takes precedence over any view, any view can overwrite the LayOut attribute to specify the desired template LayOut page.

Razor Layout-distribution View

The Action method can return the partial view in the form of PartialViewResult through the PartialView method.
It is generally used in some Ajax request code.
Controller

        public ActionResult PartialViewTest()        {            ViewData["Msg"] = "Hello world!";            return PartialView();        }

PartialViewTest. cshtml

<div>@ViewData["Msg"] </div>

Index. cshtml

<div id="divTest">     @{Html.RenderAction("PartialViewTest");}</div>

View Engine

"It's just a bracket generator"

This figure only emphasizes:
1. The view engine plays a role immediately after the Action method is executed.
It aims to obtain the data transmitted from the Controller and generate formatted output.
2. The controller does not render the view. It only prepares the data (Model) and uses the ViewResult instance to determine which view to call.
View engine interface IViewEngine

public interface IViewEngine {        ViewEngineResult FindPartialView(ControllerContext controllerContext, string partialViewName, bool useCache);        ViewEngineResult FindView(ControllerContext controllerContext, string viewName, string masterName, bool useCache);        void ReleaseView(ControllerContext controllerContext, IView view);
}

ViewEngineResult attributes

Other view engines: Spart, NHaml, Brail, StringTemplate, NVelocity

View IView

public interface IView {        void Render(ViewContext viewContext, TextWriter writer);}

The "secret" of the MVC View"

In fact, our cshtml view page is also compiled into a page class when accessed, inherited from: WebViewPage <T>

On the View page, add code

<div>@{Response.Write(this.GetType().Assembly.Location);}</div>

Running result: C: \ Windows \ Microsoft. NET \ Framework \ v4.0.30319 \ Temporary ASP. NET Files \ root \ c8628c1b \ abb1511c \ App_Web_ceor5kns.dll

Use reflector decompilation tool to view this dll

All the code on the cshtml page is compiled into the Excute method of this class.

This series of directories: ASP. NET MVC4 entry to the master series directory Summary