【问题标题】:Cannot render raw html in a Razor component无法在 Razor 组件中呈现原始 html
【发布时间】:2020-01-26 12:31:57
【问题描述】:

我在 ASP.Core 3.0 razor pages (normal) 项目中有以下 Razor 组件(Blazor 服务器端?):

@using WEKA.Models
@using Microsoft.AspNetCore.Html

<div class="jobs-list">
    @foreach (var e in News)
    {
        <div class="job" data-aos="fade-up">
            <a href="@e.Link">
                <div class="col name">@e.Text)</div>
                <div class="col more">Detail</div>
            </a>
        </div>
    }
</div>

@code {

    public List<QNewsList> News
    {
        set { }
        get
        {
            using (WEKAContext db = new WEKAContext())
            {
                var q = from n in db.Qaktuality select new QNewsList() { Datum = n.Datum.ToString("d.M.YYYY"), Text = new HtmlString(n.Text), Link = n.RssLink };
                return q.ToList();
            }
        }
    }

    public class QNewsList
    {
        public string Datum;
        public HtmlString Text;
        public string Link;
    }
}

组件在一个普通的 cshtml razor 页面中渲染:

@(await Html.RenderComponentAsync<WEKA.Components.NewsList>(RenderMode.Static))

我正在尝试使数据库字段 Text 以原始 HTML 的形式出现在网页上(即将 &amp;nbsp; 呈现为空格)。 Html 对象在此处无法调用Html.Raw。 上面的代码不会从数据库呈现原始 html。我该如何解决?

【问题讨论】:

    标签: c# asp.net-core razor-pages blazor blazor-server-side


    【解决方案1】:

    当你使用它时它应该可以工作:

    <div class="col name">@((MarkupString)e.Text)</div>
    

    【讨论】:

      【解决方案2】:

      请参阅文档here,根据@Hrnk 所说,您需要在剃须刀组件中使用MarkupString 而不是HtmlString。将代码更改为下面

      @using WEKA.Models
      @using Microsoft.AspNetCore.Html
      
      <div class="jobs-list">
          @foreach (var e in News)
          {
              <div class="job" data-aos="fade-up">
                  <a href="@e.Link">
                      <div class="col name">@e.Text</div>
                      <div class="col more">Detail</div>
                  </a>
              </div>
          }
      </div>
      
      @code {
      
          public List<QNewsList> News
          {
              set { }
              get
              {
                  using (WEKAContext db = new WEKAContext())
                  {
                      var q = from n in db.Qaktuality select new QNewsList() { Datum = n.Datum.ToString("d.M.YYYY"), Text = new MarkupString(n.Text), Link = n.RssLink };
                      return q.ToList();
                  }
              }
          }
      
          public class QNewsList
          {
              public string Datum;
              public MarkupString Text;
              public string Link;
          }
      }
      

      参考 https://github.com/aspnet/Blazor/issues/167

      https://github.com/aspnet/AspNetCore/issues/12615

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2013-05-30
        • 2021-08-20
        • 2019-08-29
        • 2021-11-19
        • 2016-04-26
        • 2020-04-21
        • 1970-01-01
        相关资源
        最近更新 更多