テーブルに表示されるデータの配列があり、そのテーブルは編集可能であり、フィールドは互いに依存しています。Angularjs入力テキストの値は別の入力テキストとその逆に依存します
セルのパーセンテージを変更して、その行の量を変更したり、その逆に変更すると、パーセンテージを変更したり、パーセンテージを変更したりできますか?百分率の合計の100%を超えないことを常に確認し、総額を超えない額の合計。
angular
.module("app", [])
.controller("appController", function ($scope) {
$scope.Data = [
{
Percent: 25.0,
Value: 1000.0
},
{
Percent: 25.0,
Value: 1000.0
},
{
Percent: 25.0,
Value: 1000.0
},
{
Percent: 25.0,
Value: 1000.0
}
];
$scope.TotalAmount = 4000.0;
});
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link rel="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css" />
</head>
<body ng-app="app">
<div class="container" ng-controller="appController">
Total amount: {{TotalAmount}}
<table class="table table-striped">
<tr><th>Percent</th><th>Value</th></tr>
<tr ng-repeat="invoice in Data">
<td><input type="number" ng-model="invoice.Percent" /></td>
<td><input type="number" ng-model="invoice.Value" /></td>
</tr>
</table>
</div>
</body>
</html>
その変人!合計値に基づいて入力ボックスにng-changeイベントを追加したり、%%他の行の値を更新することができます。あなたが変更した行に基づいて他の行の計算を行う必要があるためです。 ((合計値変更行)/(合計行数-1)のように)等しい値の他の行を更新する または、乱数生成を行い、合計値と%で検証することができます。多くの順列と組み合わせがあります。 –