html - Razor 语法 - 如何有条件地包装一些内部 HTML

Question

在 Razor 中，有一个奇怪的规则，即只允许 if block 中的 closed HTML。

参见:

Razor doesn't understand unclosed html tags

但是我有一种情况，我想在某些条件下排除一些外部的、包装的元素。我不想重复所有内部 HTML，这是相当多的 HTML 和逻辑。

是解决问题的唯一方法是为内部内容创建另一个局部 View 以保持其干燥吗？

这个新部分没有任何其他重用，感觉真的很笨拙，臃肿。我想知道该规则是 Razor 的限制还是仅仅是一个保姆(恼人的)功能。

Answer 1

您可以使用 Html.Raw(mystring) .在 myString你可以写任何你想写的东西，例如标签的打开或关闭，而不会出现任何错误。即

if (condition) {
  @Html.Raw("<div>")
}

if (condition) {
  @Html.Raw("</div>")
}

注意:@Html.Raw("<div>")可以写成更短的替代形式，像这样:@:<div>

您也可以create your own html helpers用于简化 Razor 语法。这些助手可以接收条件参数，这样你就可以做这样的事情:

@Html.DivOpen(condition)

@Html.DivClose(condition)

或更复杂的助手，允许指定属性、标签名称等。

也不是Raw ，html 助手都不会被检测为“标签”，因此您可以自由使用它们。

最好的方法

实现类似 BeginForm 的东西会安全得多html 助手。你可以看看源代码。它很容易实现:您只需在构造函数中编写开始标记，在 Dispose 中编写结束标记。方法。这种技术的优点是您不会忘记关闭有条件打开的标签。

您需要实现这个 html 助手(在静态类中声明的扩展方法):

  public static ConditionalDiv BeginConditionalDiv(this HtmlHelper html, 
    bool condition)
  {
      ConditionalDiv cd = new ConditionalDiv(html, condition);
      if (condition) { cd.WriteStart(); }
      return cd; // The disposing will conditionally call the WriteEnd()
  }

它使用这样的类:

  public class ConditionalDiv : IDisposable
  {
      private HtmlHelper Html;
      private bool _disposed;
      private TagBuilder Div;
      private bool Condition;

      public ConditionalDiv(HtmlHelper html, bool condition)
      {
          Html = html;
          Condition = condition;
          Div = new TagBuilder("div");
      }

      public void Dispose()
      {
          Dispose(true /* disposing */);
          GC.SuppressFinalize(this);
      }

      protected virtual void Dispose(bool disposing)
      {
        if (!_disposed)
        {
            _disposed = true;
            if (Condition) { WriteEnd(); }
        }
      }

       public void WriteStart()
       {
           Html.ViewContext.Writer.Write(Div.ToString(TagRenderMode.StartTag));
       }

       private void WriteEnd()
       {
           Html.ViewContext.Writer.Write(Div.ToString(TagRenderMode.EndTag));
       }
  }

您可以使用与 BeginForm 相同的模式. (免责声明:此代码未经过全面测试，但可以大致了解其工作原理。您可以接受属性、标记名称等的额外参数)。