angularjs 将函数调用绑定到 span 而不触发事件

Question

我使用 ng-repeat 来填充我的 table。 table 中的其中一列应通过不同的函数调用再次动态填充。

下面是我的代码片段。

<tr ng-repeat="item in ctrl.items">      
  <td><span ng-bind="item.name"></span></td>
  <td><span ng-bind="getItemDetails(item.id)"></span></td>
</tr>

我有很多项目。我需要在 table 中显示这些项目。项目名称将出现在项目对象中，但是，项目详细信息将由另一个需要项目 ID 的函数调用填充。

关于使用 ng-bind（如上面的代码）我面临 2 个问题。

多次调用函数，即使数组有 1 个项目。有时它会继续冻结我的浏览器和服务器内存不足问题
项目 ID 并不总是传递给函数。有时它是未定义的。

我不确定 ng-bind 是否是要使用的正确指令。 ng-model 虽然不起作用。是否有任何其他指令或其他方法可以做到这一点？

我怎样才能做到这一点？

编辑：

这是 jsfiddle url：https://jsfiddle.net/grubxaur/

如果你查看浏览器控制台，你可以看到该函数被调用了两次。我猜它叫N号。 N 为否的次数。 table.

中的列数

Answer 1

我对我的实现做了一些调整以解决这个问题。我没有在 ng-repeat 中调用函数，而是在 之前使用 angular.forEach 修改了控制器中的 items 数组ng-repeat 被调用。

类似于下面的代码。

angular.forEach(self.items, function(item){
     item.details = $scope.getItemDetails(item.id);
});

angularjs 将函数调用绑定到 span 而不触发事件

angularjs bind function call to span without triggering event

label

function

angularjs

ng-bind