asp.net mvc 中的标记 <a> 在项目中不起作用，而在另一个项目中起作用

Posted 2023-03-27

【中文标题】asp.net mvc 中的标记 <a> 在项目中不起作用，而在另一个项目中起作用

【英文标题】：Tag <a> in asp.net mvc doesn't work in a project, and is working in the other

【发布时间】：2019-05-12 18:54:25

【问题描述】：

我正在创建一个新的 ASP.NET 网站。我之前创建了一些，所以我查看了我的旧代码：

<div class="col-sm-6 col-md-6 col-lg-4">
    <a asp-action="Details" asp-route-controller="Restaurants" asp-route-id="@item.ID">
        <h4 style="white-space: nowrap;overflow: hidden;text-overflow:ellipsis;">@html.DisplayFor(ModelItem => item.Nom)</h4>
        <img src="~/images/@(nomImage) "  />
        <p>Prix : @Html.DisplayFor(ModelItem => item.PrixApproximatifPourDeux)$</p>
        <p>Type de cuisine : @Html.DisplayFor(ModelItem => item.TypeCuisine.Nom)</p>
    </a>
</div>

ASP.NET 创建的 URL 是这样的： https://localhost:44316/Restaurants/Details/3

在我的新项目中，我编写了以下代码：

<div class="col-sm-6 col-md-6 col-lg-4">
    <a asp-action="Details" asp-route-controller="Produits" asp-route-id="@item.ID">
        <h4 style="white-space: nowrap;overflow: hidden;text-overflow:ellipsis;">@Html.DisplayFor(ModelItem => item.nom)</h4>
        <img src="@Html.DisplayFor(ModelItem => item.image)"  />
        <p>Prix : @Html.DisplayFor(ModelItem => item.prix)</p>
        @Html.ActionLink("Voir le produit", "Details", "Produits", new  item.ID , null)
    </a>
</div>

控制器和视图可能不同，但整个代码或多或少是相同的。我能够在新项目中重定向的唯一方法是使用Html.ActionLink，但用户必须直接单击文本，我的目标是让整个<div> 成为一个链接，就像我的第一个项目一样。

我的项目有问题吗？还是用我的代码？

我可以将Html.ActionLink 的使用扩展到文本之外吗？

【问题讨论】：

您的第二个示例嵌套了锚标记。检查呈现的 html。

【参考方案1】：

我不确定为什么新项目中的代码不像旧项目中的代码那样工作。如果你想知道，你可能不得不发布整个新项目。

@Html.ActionLink("Voir le produit", "Details", "Produits", new item.QuoteID , null) 创建一个完整的<a href=".."></a> 标签，而@Url.Action 只是创建一个URL，例如Restaurants/Details/3。很好地解释了Html.ActionLink 和Url.Action here 之间的区别。

尝试改用Url.Action，如下所示：

<div class="col-sm-6 col-md-6 col-lg-4">
    <a href="@Url.Action("Details", "Produits", new  id = item.ID )">
        <h4 style="white-space: nowrap;overflow: hidden;text-overflow:ellipsis;">@Html.DisplayFor(ModelItem => item.nom)</h4>
        <img src="@Html.DisplayFor(ModelItem => item.image)"  />
        <p>Prix : @Html.DisplayFor(ModelItem => item.prix)</p>
    </a>
</div>

您可以扩展Html.ActionLink 以包含其他标签，例如您的代码中的<h4> 和<img> 标签，但这样做是somewhat hacky。在这里使用Url.Action 似乎很合适。