<记录> Razor引擎&视图布局

标识符 @

Razor支持HTML和C#代码混编，意味着可以在HTML中随意输出变量

基本使用方法

直接@后面跟变量（当遇到 HTML标签、空格、换行符等特殊符号时便认为@之后到特殊符号前为变量名，特殊符号后的内容原样输出）

<p>my name is @ViewBag.name</p>     

my job is @ViewBag.job

以上代码输出了 ViewBag.name 和ViewBag.job 的值

@后面跟大括号（代码段声明，代码段中代码全部当做C#代码，但是HTML标签会原样输出，输出变量同样适用@）

@{ 
    List<Employee> employees = new List<Employee>();
    for (int i = 0; i < 9; i++)
    {
        Employee employee = new Employee();
        employee.Name = "李二狗" + i;
        employee.Age = 20 + i;
        employee.Job = (Career)(i/3);
        employees.Add(employee);
    }
}

<table>
    <tr>
        <td>姓名</td>
        <td>年龄</td>
        <td>职业</td>
    </tr>
    @* 从这里开始声明C#代码段 *@
    @foreach (Employee item in employees)
    {
        <tr>
             @*  在C#代码段中 HTML标签会被原样输出（混编的好处） 输出变量需要在前面加上@  *@   
         <td>@item.Name</td>
           　　 <td>@item.Age</td>
            　　<td>@item.Job.ToString()</td>
        </tr>
    }
</table>

注释

@*注释代码*@       会被输出，查看源代码可以看到
<!--注释代码-->     不会输出

引入命名空间

@using 命名空间

视图布局

1. 布局页引入

一般放在 ~/View/Shared/布局页名称.cshtml
在需要布局页的页面首部引用布局页

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

可以在_ViewStart.cshtml中设置，这样所有的页面都会生效

2.布局页语法

定义：

<body>
    <div>
        @RenderSection("header")
        <hr />
        @RenderBody()
        <hr />
        @RenderSection("footer")
    </div>
</body>

使用：

@section footer
{
    <h1>here is footer for home page</h1>    
}

<h2>here is body for Home Page</h2>

@section header
{
    <h1>Here is header for Home page</h1>
}

header区域的内容会被输出到header footer区域内容会被输出到footer 无论顺序如何

3. 引入静态文件

.net MVC提供一套静态文件打包工具

需要在/App_Start/BundleConfig.cs中先定义，例如

//在视图中引入Content/css相当于引入 bootstrap.css 和 site.css 
bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/bootstrap.css",
            "~/Content/site.css"));

视图中使用

@Styles.Render("~/content/home")
//引入css
@Scripts.Render("~//bundles/jquery")
//引入js