1

我有一张这样的桌子：

<tr class="data-row" ng-repeat="item in model.Invoice.InvoiceItemData">
        <td>
            <input type="text" name="itemServiceTitle" ng-model="item.ServiceTitle" />
        </td>
        <td>
            <input type="text" name="itemQuantity" ng-model="item.Quantity"/>
        </td>
        <td>
            <input type="text" name="itemPricePerDimension" ng-model="item.PricePerDimension" />
        </td>
        <td>
            <input type="text" name="itemDeliveryCost" ng-model="item.DeliveryCost" readonly="readonly" />
        </td> ...

我需要通过公式计算每个 itemDeliveryCost

item.DeliveryCost = item.Quantity * item.PricePerDimension

问题是 - 最好的方法是什么？请注意， item.Quantity 和 item.PricePerDimension 的 cahges 必须动态反映在 item.DeliveryCost 中。

4

2 回答 2

2

作为DeliveryCost = Quantity * Price，我建议每次更改数量或价格时更新DeliveryCost。这正是使用：ng-change

<input type="text" ng-model="item.Quantity" ng-change="updateCost()"/>

<input type="text" ng-model="item.PricePerDimension" ng-change="updateCost()"/>

<input type="text" ng-model="item.DeliveryCost"/>

然后，在您的控制器updateCost()函数中定义：

$scope.updateCost = function() {
    $scope.item.DeliveryCost = $scope.item.Quantity * $scope.item.PricePerDimension;
}
于 2017-01-27T09:34:25.140 回答
1

在您的 api 成功调用中，您可以执行以下操作

angular.forEach($scope.model.Invoice.InvoiceItemData, function (item) {
    item.DeliveryCost = item.Quantity * item.PricePerDimension;
});

您将在视图中获得计算值..

如果您想在获取数据后更改值，那么上述方法将不起作用，但为此您需要调用一个关于数量和维度的值更改的方法，如下所示

  <input type="text" name="itemQuantity" ng-model="item.Quantity"  
     ng-blur="deliveryCostChanging(item)"/>
  <input type="text" name="itemPricePerDimension"   
    ng-model="item.PricePerDimension" ng-blur="deliveryCostChanging(item)"/>


$scope.deliveryCostChanging = function(item){
     item.DeliveryCost = item.Quantity * item.PricePerDimension;
};
于 2017-01-27T07:28:27.133 回答