2017-03-20 16 views
0

なぜ次のコードが機能しないのか分かりません。AngularJs - Ngリピート配列

私は、次のような配列の予約を持っているコードの前に
<div ng-repeat="r in reservations" ng-init="new = r.some_code"> 

<div ng-if="old == new"> 
    <p ng-init="sum = sum + r.cost">{{r.name}} - {{r.cost}}</p> 
</div> 

    <div ng-if="old != new"> 
     <p ng-init="old = new;">Total: {{sum}}</p> 
    </div> 

</div> 

reservations = [{name: client 1, some_code = 15, cost: 1000}, 
{name: client 1, some_code = 15, cost: 1000}, 
{name: client 2, some_code = 15, cost: 1000}, 
{name: client 3, some_code = 16, cost: 2000}, 
{name: client 4, some_code = 16, cost: 3000}, 
{name: client 5, some_code = 17, cost: 3000}] 

$scope.old = reservations[0].some_code; 
$scope.sum = 0; 

私のようなものを得る結果:

15 - client 1 - 1000 
15 - client 2 - 1000 
15 - client 3 - 1000 
Total: 0 
Total: 0 

を私は時代の束を試みたが、違うと間違った結果私が欲しいのは、各予約を表示し、 "some_code"が変更された場合、合計を表示することです。

どうすればよいですか?

注:配列はsome_codeでソートされています。

+1

ようになるでしょうか? –

答えて

0

あなたの配列には2つのクライアント1がありますが、関連性があるかどうかはわかりません。

この合計ロジックをコントローラに移動する方が良いかもしれないと思います。あなたはキーとしてsome_codeを、合計値としてハッシュを作成することができます。

それはあなたの代わりに、モデル計算でビューをpolutingの、コントローラにループのために、あなたの値を計算していない理由は、この

$scope.reservations = [{name: client 1, some_code = 15, cost: 1000}, 
 
{name: client 1, some_code = 15, cost: 1000}, 
 
{name: client 2, some_code = 15, cost: 1000}, 
 
{name: client 3, some_code = 16, cost: 2000}, 
 
{name: client 4, some_code = 16, cost: 3000}, 
 
{name: client 5, some_code = 17, cost: 3000}]; 
 

 
$scope.totals = {}; 
 
for (var i = 0; i < $scope.reservations.length; i++) { 
 
\t if (totals[$scope.reservations[i].some_code]) { 
 
\t \t totals[$scope.reservations[i].some_code] += $scope.reservations[i].cost; 
 
\t } else { 
 
\t \t totals[$scope.reservations[i].some_code] = $scope.reservations[i].cost; 
 
\t } 
 
}
<div ng-repeat="r in reservations" ng-init="new = r.some_code"> 
 
    <div> 
 
\t <p> {{r.name}} - {{r.cost}} </p> 
 
    </div> 
 

 
    <div> 
 
\t <p> Total: {{totals[r.some_code]}} 
 
    </div> 
 
</div>

+0

これは私を助けました。ありがとう。 –

0

some_codeで予約をレンダリングし、詳細を選択して表示することができます。猫をスキンする方法:JSFiddle