asp.net-mvc 如何在剃刀代码块中插入空格？

How do I insert spaces within a razor Code block?

提问by Alan

VS2013, MVC5, Razor, VB

VS2013、MVC5、Razor、VB

I want spaces in front of the word 'Answered'. How do I force spaces into the following Razor code block?

我想要在“已回答”这个词前面有空格。如何强制空格进入以下 Razor 代码块？

@Code If Model.DisplayAnsweredFlag Then
  @If Model.Answered Then
    @Html.Raw("Answered")
   End If
 End If
End Code

In html.raw(), spaces by themselves or spaces in of front text don't seem to get coded into the page. But I also can't use '&nbsp' or '@&nbsp' in a Code Block because it's incorrect syntax.

在 html.raw() 中，空格本身或前面文本中的空格似乎没有被编码到页面中。但我也不能在代码块中使用“ ”或“@ ”，因为它的语法不正确。

If I'm coding with a poor technique, please advise, or if there is a different way to get the spaces in, please advise.

如果我的编码技术很差，请提供建议，或者如果有其他方法可以输入空格，请提供建议。

回答by MikeTeeVee

AndyBukgave the answer here:
https://forums.asp.net/t/1772048.aspx?How+to+use+no+break+space+HTML+character+inside+if+brackets+in+a+view+

AndyBuk在这里给出了答案：https: //forums.asp.net/t/1772048.aspx?How+to+use+no+break+space+HTML+character+inside+if+brackets+in+a+view+

In that link he writes:

在那个链接中，他写道：

The introduction to Razor syntax at:
http://www.asp.net/web-pages/tutorials/basics/2-introduction-to-asp-net-web-programming-using-the-razor-syntaxis quite useful.
To force html output for your string, you may use <text>to Block or @:as a Prefix.

Razor 语法简介：
http: //www.asp.net/web-pages/tutorials/basics/2-introduction-to-asp-net-web-programming-using-the-razor-syntax非常有用。
要强制为您的字符串输出 html，您可以使用<text>to Block 或@:作为前缀。

@if (condition)
{
    <text>&nbsp;</text>
    @:&nbsp;
}

回答by Chris Pratt

Spaces are ignored when parsing HTML, unless they occur within a preblock. If you want to pad some text, you need to take one of the following approaches:

解析 HTML 时会忽略空格，除非它们出现在pre块中。如果要填充一些文本，则需要采用以下方法之一：

1. Wrap it in a block-level HTML element like por div, and then add padding/margin to the element using CSS. This is the recommended approach.

2. Use  in place of the regular spaces you're trying to pad with. Only non-breaking spaces are counted when rendering HTML. However, this approach is hacky and not recommended.

3. Wrap your text in a preelement. Then all whitespace within the <pre>and </pre>tags will be taken into account. However, this approach is also hacky and not recommended.

1. 将其包裹在块级 HTML 元素中，例如p或div，然后使用 CSS 向元素添加 padding/margin。这是推荐的方法。

2. 使用 替代你想垫与常规空间。渲染 HTML 时只计算不间断空格。但是，这种方法很笨拙，不推荐。

3. 将文本包裹在一个pre元素中。然后将考虑<pre>和</pre>标签中的所有空白。但是，这种方法也很老套，不推荐使用。

回答by Subhash Saini

<text> &nbsp; &nbsp; &nbsp;</text>

Insert " " to add more blank spaces.

插入“  ”以添加更多空格。

回答by Sameer Alibhai

Why don't you try a different approach. Use a span tag with some padding on it

你为什么不尝试不同的方法。使用带有一些填充的 span 标签

回答by Developer

I use this approach when I need to display a structure in the table.

当我需要在表格中显示结构时，我会使用这种方法。

The itemhas precalculated the levelproperty.

在item已预先计算的level性能。

@helper PrintChild(List<ItemBalanceView> items)
{
    foreach (var item in items)
    {
        <tr>
            <td>@Html.Raw(InsertSpaces(item.LevelNum))<a class="text-primary" href='@Url.Content("~/Items/DetailsPos/")@item.ItemDocDetailID'>@item.ItemDocDetailName</a></td>
            <td>@Math.Round(item.Qty, 2)</td>
            <td>@Math.Round(item.Price, 2)</td>
            <td>@Math.Round(item.Total, 2)</td>
        </tr>

        if (item.Children != null)
        {
            @PrintChild(item.Children)
        }
    }
}

@functions  
{
    string InsertSpaces(int level)
    {
        var str = string.Empty;
        for (int i = 0; i < level; i++)
        {
            str += "&nbsp;&nbsp;";
        }

        return str;
    }
}

<table class="table table-sm">
    <thead>
        <tr>
            <th>Name</th>
            <th>Qty</th>
            <th>Price</th>
            <th>Total</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.BalancesAsStructure)
        {
            <tr>
                <td>@Html.Raw(InsertSpaces(item.LevelNum))<a class="text-primary" href='@Url.Content("~/Items/DetailsPos/")@item.ItemDocDetailID'>@item.ItemDocDetailName</a></td>
                <td>@Math.Round(item.Qty, 2)</td>
                <td>@Math.Round(item.Price, 2)</td>
                <td>@Math.Round(item.Total, 2)</td>
            </tr>

            if (item.Children != null)
            {
                @PrintChild(item.Children)
            }
        }
    </tbody>
    <tfoot>
        <tr style="background-color:#d7c0c0!important;">
            <th></th>
            <th></th>
            <th></th>
            <th>@Math.Round(Model.Total, 2)</th>
        </tr>
    </tfoot>
</table>