在cshtml文件中的C#块代码之间插入html标记

时间:2018-01-12 18:51:33

标签: razor asp.net-core asp.net-core-mvc asp.net-core-2.0 razor-pages

我想在C#块代码之间使用html标签,我已经尝试了但是我遇到了错误。 如何在cshtml文件中的C#块代码之间插入html标签?

错误是:

  

仅赋值调用增量递减和新对象表达式   可以用作声明

     

只有赋值调用增量减少等待和新对象   表达式可以用作语句   enter image description here

@{
    Func<List<Comment>, Comment, HelperResult> ShowTree = null;
    ShowTree = (items, node) =>
    {
        @<text>
            <ul>
                @foreach (var comment in items)
                {

                }
            </ul>
         </text>;
        return null;
    };

}
  

更新:当我将文本移到{}之外时,我也遇到了一些错误。   看这张图片。   enter image description here

更新2: 我使用了@:,但仍有问题。那是;expected

我该如何解决这个问题?

enter image description here

@{
Func<List<Comment>, Comment, int, HelperResult> ShowTree = null;
ShowTree = (items, parentItem, parentId) =>
{
    var count = items.Count(p => p.ParentId == parentId);
    if (count > 0)
    {
        @:<ul>
            foreach (var item in items.Where(p => p.ParentId == 
 parentId).ToList())
            {
            @:<li>
                string collapseId = string.Format("collapse_{0}", item.Id);
                @:<a class="btn btn-link" data-toggle="collapse" 
 href="#@{collapseId}" aria-expanded="True" aria-controls="@{collapseId}">
                    @:<span class="fa fa-minus" aria-hidden="true"> 
 Commenter Name</span>
                @:</a>
                    @:<div class="collapse show" id="@{collapseId}">
                        @:<div class="card">
                                @:<p>item.Description</p>
                        @:</div>
                            ShowTree(items, item, item.Id);
                    @:</div>
            @:</li>
            }
        @:</ul>
    }
    return null;
  };
};

更新3:在浏览器中显示错误消息的最新代码

@using Jahan.Beta.Web.App.Helper
@using Jahan.Beta.Web.App.Models
@using Microsoft.AspNetCore.Mvc.Razor
@using Jahan.Beta.Web.App.Helper
@model List<Comment>

@{
   Func<List<Comment>, Comment, int, HelperResult> ShowTree = null;
   ShowTree = (items, parentItem, parentId) =>
   {
   var count = items.Count(p => p.ParentId == parentId);
   if (count > 0)
   {
   @:<ul>
   @<text>@{
        foreach (var item in items.Where(p => p.ParentId ==    
   parentId).ToList())
        {
            string collapseId = string.Format("collapse_{0}", item.Id);
            <li>
                <a class="btn btn-link" data-toggle="collapse" href="@collapseId" aria-expanded="True" aria-controls="@collapseId">
                <span class="fa fa-minus" aria-hidden="true"> Commenter Name</span></a>
                <div class="collapse show" id="@collapseId"><div class="card"><p>@item.Description</p></div>
                    @ShowTree(items, item, item.Id);
                </div>
            </li>
        }
}</text>

@:</ul>
}
return null;
};
}


 @{
 Func<List<Comment>, HelperResult> CreateTree = null;
 CreateTree = commentList => new Func<List<Comment>, HelperResult>(
 @<text>@{
    List<Comment> nodesRoot = commentList.Where(p => p.ParentId == 
 null).ToList();
    <ul>
        @foreach (var comment in nodesRoot)
        {
            <li>
                <p>@comment.Description</p>
                @ShowTree(commentList, comment, comment.Id);
            </li>
        }
    </ul>
  }
   </text>)(null);
  }

<div class="media mb-4">
<div class="media-body">
    @CreateTree(Model)
</div>

</div>

Latest codes

Error messages that shows in browser

  

编译所需资源时发生错误   处理此请求。请查看以下特定错误   详细说明并适当修改源代码。   生成的代码

     

预期

5 个答案:

答案 0 :(得分:3)

cshtml使用@:中的C#代码块进行内联转义。例如:

@{
    Func<List<Comment>, Comment, HelperResult> ShowTree = null;
    ShowTree = (items, node) =>
    {
        @:<ul>
            foreach (var comment in items)
                {

                }
        @:</ul>
        return null;
    };
}

答案 1 :(得分:1)

我认为你想通过将Html与C#代码混合来呈现一些内容,而不是在cshtml文件中插入你的C#代码,你可以创建自定义的Html帮助器,它将是这样的:

     public static class CustomHtmlHelper
        {
            public static IHtmlContent ShowTree(this IHtmlHelper htmlHelper)
            {
                Func<List<Comment>, Comment, HelperResult> ShowTree = null;

                var builder = new StringBuilder();

                ShowTree = (items, node) =>
                {
                    builder.Append("<ul>");

                    foreach (var comment in items)
                    {
                        builder.Append("<li>"+comment.Content+"</li>");

                    }
                    builder.Append("</ul>");
                    return null;
                };

                //Just for testing purposes only

                var comments = new List<Comment> { new Comment { Content = "Comment 1" }, new Comment { Content = "Comment 2" } };

                ShowTree(comments, new Comment());

                //
                return new HtmlString(builder.ToString());

            }
        }
  • 在cshtml中

    @ Html.ShowTree()

答案 2 :(得分:0)

为什么不将<text><ul>移到{}之外。像这样:

<text>
<ul>
    @{
        Func<List<Comment>, Comment, HelperResult> ShowTree = null;
        ShowTree = (items, node) =>
        {

            foreach (var comment in items)
            {
            }
            return null;
        };

    }
</ul>
</text>;

将您的代码置于多个括号中

@{
    var commentList = new List<string>();
}
<text>
    <ul>
        @foreach (var comment in commentList)
        {
            <li>@comment</li>
        }

    </ul>
</text>;

答案 3 :(得分:0)

它可以帮到你吗?

@{
Func<List<Comment>, Comment, int, HelperResult> ShowTree = null;

ShowTree = (items, parentItem, parentId) =>
{
var count = items.Count(p => p.ParentId == parentId);
if (count > 0)
{
        @:<ul>
    foreach (var item in items.Where(p => p.ParentId == parentId).ToList())
{
    string collapseId = string.Format("collapse_{0}", item.Id);
            @<text>
            <li>
                <a class="btn btn-link" data-toggle="collapse"
                   href="@{collapseId}" aria-expanded="True" aria-controls="@{collapseId}">
                    <span class="fa fa-minus" aria-hidden="true"> Commenter Name</span>
                </a>
                <div class="collapse show" id="@{collapseId}">
                    <div class="card">
                        <p>@item.Description</p>

                    </div>
                    @ShowTree(items, item, item.Id);
                </div>
            </li>
            </text>
                    }
@:</ul>
}
return null;
};
}

答案 4 :(得分:-1)

删除@之前的<text>