AngularJS中ng-repeat如何传双参数用过滤器？值无法更新求助

你遇到的问题主要是对AngularJS过滤器的设计意图理解有误，再加上函数内部的变量引用错误，导致无法更新d.Balancedcommodity的值，具体原因和解决方法如下：

为什么你的代码无法生效？ #

• 过滤器的设计目的不允许修改原始模型：AngularJS的过滤器本质是纯函数，它的作用是接收输入数据，返回转换/格式化后的结果，而不是修改传入的原始数据。框架不会追踪过滤器对模型的修改，就算你强行修改，也不会触发视图的更新。
• 函数内部的d未定义：你的GetBalance函数只接收了Quantity和lock两个参数，函数里的d是不存在的变量，所以d.Balancedcommodity = available这行代码根本找不到对应的对象，自然无法赋值。
• 视图绑定机制不支持这种操作：过滤器是在视图渲染时临时计算值，它的执行逻辑和Angular的数据更新机制脱节，就算你能修改模型，也无法同步到视图中。

正确的解决方法 #

根据你的需求，推荐两种方案，你可以根据数据是否动态变化来选择：

方案一：提前在控制器中计算（推荐，性能更好） #

如果TranHistory是一次性加载的，或者数据变化不频繁，最好在获取到数据后直接遍历计算每个项的Balancedcommodity，这样模板里直接绑定即可：

// 假设你从接口或其他地方获取到TranHistory数据后
$scope.TranHistory = yourData;
$scope.TranHistory.forEach(function(item) {
  if (item.Quantity > 0 && item.Qty_Lock > 0) {
    item.Balancedcommodity = item.Quantity - item.Qty_Lock;
  } else {
    // 处理其他情况，比如默认设为0或者保留原有值
    item.Balancedcommodity = item.Balancedcommodity || 0;
  }
});

模板代码简化为：

<tr ng-repeat="d in TranHistory">
  <td>{{d.Quantity}}</td>
  <td>{{d.Qty_Lock}}</td>
  <td>{{d.Balancedcommodity}}</td>
</tr>

方案二：动态计算（适合数据频繁变化的场景） #

如果Quantity或Qty_Lock会动态改变，你可以在模板中调用函数直接计算显示，或者用ng-init提前计算模型值：

方式1：直接在模板中调用函数显示

<tr ng-repeat="d in TranHistory">
  <td>{{d.Quantity}}</td>
  <td>{{d.Qty_Lock}}</td>
  <td>{{getBalance(d.Quantity, d.Qty_Lock)}}</td>
</tr>

控制器中的函数：

$scope.getBalance = function(quantity, lock) {
  if (quantity > 0 && lock > 0) {
    return quantity - lock;
  }
  return 0; // 根据需求设置默认值
};

⚠️ 注意：这种方式每次Angular的digest循环都会调用函数，如果列表数据量大，可能会有性能影响。

方式2：用ng-init初始化计算

<tr ng-repeat="d in TranHistory" ng-init="calculateBalance(d)">
  <td>{{d.Quantity}}</td>
  <td>{{d.Qty_Lock}}</td>
  <td>{{d.Balancedcommodity}}</td>
</tr>

控制器中的函数：

$scope.calculateBalance = function(item) {
  if (item.Quantity > 0 && item.Qty_Lock > 0) {
    item.Balancedcommodity = item.Quantity - item.Qty_Lock;
  } else {
    item.Balancedcommodity = item.Balancedcommodity || 0;
  }
};

如果数据动态变化，你需要在数据更新时重新调用calculateBalance函数，或者用$watch监听Quantity和Qty_Lock的变化。

总结 #

记住AngularJS过滤器的核心作用是格式化输出，不要用它来修改原始数据模型。修改模型的操作应该放在控制器、指令或者服务中，这样才能保证数据和视图的同步更新。

内容的提问来源于stack exchange，提问作者Md Gosoddin