javascript - Angular ng-repeat 将参数传递给 href 链接

Question

我有一个现有的 grails 应用程序，使用 GSP 和自定义 tagLibs 构建。我需要合并一些使用 AngularJS 的新代码。 我是 AngularJS 的新手。

具体来说，我有使用自定义标签生成的现有链接，例如:

<g:custonSearchLink id="${ent.id}" >

评估为

<a href="fullPath/controllerName/method/X", onclick="jQuery.ajax((type:'POST', url:'fullPath/controllerName/method/X', success:function(data,textStatus){jQuery('tableDiv').html(data);}, error:function(...)){}});return false" >...

其中 X 是 id 参数。我需要让 ng-repeat 生成这些链接，并将“X”参数值传递到 href 和 ajax url 路径中。

所以我明白我可以只使用嵌套的大括号“{{}}”将 X 参数从对象传递到 href 字符串中，

<li ng-repeat="obj in myList track by obj.id" >
  <a href="fullPath/controllerName/method/{{obj.id}}"

但是 onclick ajax url 嵌套在 onclick 字符串内的单引号字符串中。我怎样才能将“X”参数传递给它？ 这不起作用:

onclick="jQuery.ajax((type:'POST', url:'fullPath/controllerName/method/{{obj.id}}', 

请注意，在我的例子中，“fullPath”是“https://localhost:8453/”，因为响应 AJAX 调用的服务器运行在与托管 GSP 的服务器不同的端口上。

Answer 1

使用 ng-href和 ng-click允许您在 javascript 事件处理程序中使用 AngularJS 范围变量。像这样:

<div ng-repeat="someItem in list track by someItem.id">
  <a ng-href="/your/url/to/this/id/{{ someItem.id }}"></a>
  <button ng-click="$scope.someAction(someItem.id)"></button>
</div>

因此您的特定点击事件处理程序将是:

ng-click="jQuery.ajax((type:'POST', url:'fullPath/controllerName/method/{{obj.id}}'"

正如 Shashi 所提到的，您可以在范围函数中触发 HTTP 请求，尽管您当前使用内联 AJAX 处理此请求的方式应该可行。