Question

我是ASP.net和MVC 5的新手。

我使用asp.net教程创建了一个测试项目。

我试图根据另一列缩进表中的文本。

所以我的表格如下所示

 Title, Level.
 A       1
 B       2
 c       2
 D       3
 E       1

根据我想在上面的mvc视图中显示的级别，可以在前面添加标签。

A
  B
  C
    D
E

我得到的只是

A
B
C
D

我不确定如何添加标签。以下是我的代码

@foreach (var item in Model) {
<tr>
   <td>
        @Html.Label(item.Title)              
    </td>
</tr>
}

感谢。

Answer 1

除了ArsenMkrt的优秀答案之外，您还可以使用动态填充：

@foreach (var item in Model) {
    <tr>
       <td style="padding-left: @((item.Index-1)*10)px;">
            @Html.Label(item.Title)              
        </td>
    </tr>
}

这会产生类似这样的东西

＆＃13;

<table border=1>
  <tr>
    <td style="padding-left: 0px;">A</td>
  </tr>
  <tr>
    <td style="padding-left: 20px;">B</td>
  </tr>
  <tr>
    <td style="padding-left: 20px;">C</td>
  </tr>
  <tr>
    <td style="padding-left: 40px;">D</td>
  </tr>
  <tr>
    <td style="padding-left: 0px;">E</td>
  </tr>
</table>

＆＃13;

Answer 2

创建一个通过递归深入的函数

@helper TreeView(List<Items> items, int level)
{
    foreach (var item in items.Where(i=>i.level == level))
    {
    <li>
        <span>@item.Title</span>
        <ul>
            @TreeView(items, level+1)
        </ul>
    </li>
    }
}

比视图添加

<ul>
    @TreeView(Model, 1)
</ul>

并将列表样式设置为none以删除项目符号

ul
{
    list-style-type: none;
}

如何在MVC 5视图中缩进字符串

2 个答案: