ui-sref 不产生正确的带参数的href答案

【问题标题】：ui-sref does not produce correct href with parameterui-sref 不产生正确的带参数的href
【发布时间】：2015-03-12 20:27:50
【问题描述】：

我正在尝试使用 ui-router 更改状态并将 GUID 参数传递给我的控制器。我使用剑道（不同的语法）进行这项工作，所以我知道我的目标是什么。我一生都无法弄清楚这笔交易是什么。我进行了广泛的搜索，我相信我有正确的 ui-sref 语法。这里是：

&lt;a ui-sref="clientEdit({ clientId: '{{vm.clientModel.id}}' })"&gt;Edit Link&lt;/a&gt;

在渲染视图中生成此输出（注意缺少 id）：

&lt;a ui-sref="clientEdit({ clientId: 'bfd50b6c-6542-48c5-adf7-8c1a21caf421' })" href="#/clientEdit/"&gt;Edit Link&lt;/a&gt;

这是我的状态：

.state("clientEdit", {
  url: "/clientEdit/:clientId",
  templateUrl: "/CompanyDashboard/ClientsCrud",
  controller: "DashboardClientsCtl",
  controllerAs: "vm"
})

当我将 ID 硬编码到 ui-sref 中时，它会按预期工作并为标签生成正确的 href。像这样：

&lt;a ui-sref="clientEdit({clientId:'bfd50b6c-6542-48c5-adf7-8c1a21caf421'})"&gt;Hard code Edit Link&lt;/a&gt;

硬编码的 ID 标签在渲染视图中产生这个输出（正如我所期望的那样）：

&lt;a ui-sref="clientEdit({clientId:'bfd50b6c-6542-48c5-adf7-8c1a21caf421'})" href="#/clientEdit/bfd50b6c-6542-48c5-adf7-8c1a21caf421"&gt;Hard code Edit Link&lt;/a&gt;

所以，我的问题是：我在这里遗漏了什么吗？我真的相信这应该可行，因为我已经成功地使用剑道模板进行了不同的路线。

以防万一，这里是可用的剑道模板代码：

template: "&lt;a ui-sref='clientDetails({clientId:\"#=id#\"})'&gt;#=customerNumber#&lt;/a&gt;"

我已尝试将引号更改为 Kendo 示例中的两倍，删除引号，从 Id 表达式中删除 {{ }}。没有喜悦。

感谢所有帮助。

【问题讨论】：

标签： angular-ui-router ui-sref

【解决方案1】：

这里的解决方案是不用{{}}包装参数

// instead of this
<a ui-sref="clientEdit({ clientId: '{{vm.clientModel.id}}' })">Edit Link</a>
// use this
<a ui-sref="clientEdit({ clientId: vm.clientModel.id})">Edit Link</a>

vm.clientModel.id 的内容已经是一个字符串，并且会作为字符串正确传递（它是 JS 的 GUID 它是字符串）

【讨论】：

感谢您的回复。刚刚试了一下，还是没有解决问题。

【解决方案2】：

所以，我以为我昨天在发布问题之前已经尝试过了，但我没有。这是正确的语法：

&lt;a class="btn btn-sm btn-primary" ui-sref="clientEdit({ clientId: {{'vm.clientModel.id'}} })"&gt;Edit Client Test&lt;/a&gt;

请注意，单引号在 {{ }} 的内部，而不是在外部。简单吧？

此 HTML 生成正确的 HREF，如下所示：

&lt;a class="btn btn-sm btn-primary" ui-sref="clientEdit({ clientId: vm.clientModel.id })" href="#/clientEdit/bfd50b6c-6542-48c5-adf7-8c1a21caf421"&gt;Edit Client Test&lt;/a&gt;

【讨论】：