Question

我正在尝试找出插入额外div的位置以及如何删除它。

在我们的Index.cshtml文件中，我们有：

<div id="an-id">
    @Html.DisplayFor(m => m.BottomArticleListContentArea, new { ViewName = "_ArticleListBlockNoHeader" })
</div>

在我们的_ArticleListBlockNoHeader.cshtml视图中，代码如下所示：

@if (Model != null)
{
    for (int i = 0; i < Model.Items.Count; i++)
    {
        var article = Model.Items[i];
        <div class="item" data-articleid="@article.ArticleId">
        Item @article.ArticleId
        </div>
    }
}

BottomArticleListContentArea是ContentArea，由此DisplayTemplate处理：

@model ContentArea
@if (Model != null)
{
    Html.RenderContentArea(Model);
}

正如您所看到的，除了检查它是否为空之外，它实际上并没有做任何事情。哦......也许它会做更多事情！

当我查看生成的html时，它看起来像这样：

<div id="an-id">
<div><div>

    <div class="item" data-articleid="1">Item 1</div>
    <div class="item" data-articleid="2">Item 2</div>
    <div class="item" data-articleid="3">Item 3</div>
    <div class="item" data-articleid="4">Item 4</div>
    <div class="item" data-articleid="5">Item 5</div>
</div></div>
</div>

请注意，在行 2 和 9 上有两个div（<div><div>和</div></div>）不在我刚刚分享的代码中上方。

我的假设现在是这两个div可能是通过某个扩展方法或某个处理程序或其他东西添加的。我不熟悉整个代码库，而且我对ASP.net很新，所以我对ASP.net中插入点的了解非常有限。

这两个div来自哪里？我怎样才能开始寻找它们？

如果问题中缺少某些内容，请告知我们，尽量简短，以便更容易阅读和理解

提前致谢！

编辑：

清理代码时出错，添加回来以便结果是代码生成的结果。

上面的HTML结果是使用fiddler返回和捕获的内容。在记录DOM时，没有JS开始运行。

添加了使用的显示模板。

Answer 1

这是我现在的解决方案，我将尝试一段时间：

（高度EPiServer特定）

我们不是让它使用RenderContentArea进行渲染，而是控制它并使用RenderContentData

创建“原始”方式

foreach (var content in Model.FilteredItems)
{
    Html.RenderContentData(content.GetContent(), false, Model.Tag);
}

这消除了所有额外的div并使其表现得像我们想要的那样，就像我们读取代码时所看到的那样。是的，有了这个，我们也失去了直接在epi中直观编辑页面的能力。但是这是我们以后需要研究的东西，现在，它有效，我很高兴。

我还写了这个扩展版本，让我选择是否要跳过包装器或不喜欢这样（注意DisableWrapper = true）

@Html.DisplayFor(m => m.ContentArea, new { DisableWrapper = true, ViewName = "_ArticleList" })

如果我改为将第一个代码段更改为：

，则可以这样做

var disableWrapper = Html.ViewContext.ViewData["DisableWrapper"] as bool?;

if (disableWrapper.GetValueOrDefault())
{
    foreach (var content in Model.FilteredItems)
    {
        Html.RenderContentData(content.GetContent(), false, Model.Tag);
    }
}
else
{
    Html.RenderContentArea(Model);
}

这有效，似乎产生了我正在寻找的结果。如前所述，我没有在这个领域工作那么久，所以如果有任何建议或提示，我很乐意听到这一点，并能够在这里和项目中改进我的解决方案。

感谢有用的评论让我最终得到了这个解决方案！

如何在ASP.net中跟踪/调试html创建

1 个答案: