AngularJS 使用表达式作为 href

Question

我的网页已设置为当用户选择多个选项之一时会出现许多超链接并将您带到该网页。为了让我的代码不那么枯燥，我创建了一个 ng-repeat div 来为用户输出所有选项。所有超链接都正确显示在页面上，但链接本身已损坏，因为 href 无法使用其中的表达式。

<div style="text-align:center" ng-repeat="page in pages">
    <a href='@Url.Action("{{ page.name }}", "Dashboards")'>{{ page.name }}</a>
</div>

我尝试用 ng-href 替换 href，因为它应该有助于在 HTML 更改页面之前处理表达式，但没有效果。然后我删除了表达式周围的大括号和引号，因为在表达式中你不应该需要它们。但是代码现在有一个错误，因此它不会运行。这是我们在 div 中创建每个页面时的样子：

<a href="@Url.Action("ReviewAndAdjust", "Dashboards")">ReviewAndAdjust</a>
<a href="@Url.Action("Maps", "Dashboards")">Maps</a>

Answer 1

您不能将服务器代码 (Razor) 与客户端代码 {{ expression }} 一起使用，因此您必须解码 @Url.Action 以便对其进行处理。您必须创建一个 url 变量才能正常工作

@{
  var url = Url.Action("{{ page.name }}", "Dashboards");
  url = url = HttpUtility.UrlDecode(url);
}


<div style="text-align:center" ng-repeat="page in pages">
    <a ng-href="@url">{{ page.name }}</a>
</div>

AngularJS 使用表达式作为 href

AngularJS using an expression as an href

html

c#

razor

angularjs

angularjs-ng-href