时间戳

首页 > 解决方案 > Razor：将带有 _blank、noopener、noreffer 属性的 href 转换为 Html ActionLink

razor - Razor：将带有 _blank、noopener、noreffer 属性的 href 转换为 Html ActionLink

问题描述

我想创建一个 url，例如Html ActionLink在新选项卡中打开并具有`rel` 的noopener+noreferrer值

<a 
    target="_blank"
    rel="noopener noreferrer"
    href="https://localhost:5001/Gallery/View?file=@Model?.Image?.Id">
    @Model?.Image?.Title
</a>

但是这样我就硬编码了网址

我试过这样的事情：

<a 
target="_blank"
rel="noopener noreferrer" 
href="@Html.ActionLink(item?.Image?.Title, "View", "Gallery", new { file = item?.Image?.Id })">
</a>

或者

<a 
target="_blank" 
rel="noopener noreferrer" 
@Html.ActionLink(item?.Image?.Title, "View", "Gallery", new { file = item?.Image?.Id })>
</a>

但它在转义 html 时遇到了困难，并以类似的方式结束

<a target="_blank" rel="noopener noreferrer" <a href="/Gallery
/View?file=123">Testimage.jpg</a>></a>

因此，链接通常有效，但会破坏 html 结构。

标签： razorasp.net-corerazor-pages

解决方案

Html.ActionLink 助手将生成整个<a>标签。所以你需要在外面使用它。只需在您的页面中使用以下代码，无需任何<a>标记

@Html.ActionLink(item?.Image?.Title, "View", "Gallery", new { file = item?.Imnage?.Id }, new { target = "_blank", rel = "noopener noreferrer" })

例子

    <div>
       @Html.ActionLink("Testimage.jpg", "View", "Gallery", new { file = 1 }, new { target = "_blank", rel = "noopener noreferrer" })
   </div>

会给你以下结果。

    <div>
       <a href="/Gallery/View?file=1" rel="noopener noreferrer" target="_blank">Testimage.jpg</a>
   </div>

推荐阅读