角度$ウォッチ機能はどのようにスライダーで動作しますか

Question

みんな。私はウェブ開発に新しいです、そして、私は問題に遭遇しました。私は最終的に、より具体的にするために私の問題の手伝いを作りました。

私の問題は、私は2スライダーがあることです。 1つのスライダが値を扱い、もう1つのスライダがウェイトを返します。これらのスライダはng-repeat関数でn回繰り返されます。デモンストレーションの目的で、フィドルでは2回だけ。

Iは、以下の式から成る指数を計算したい：

Value1*Weight1+Value2*Weight2 

インデックスが低減関数を用いて計算されます。 問題：スライダーの変更による値の変更時にインデックス値が更新されない $ watch関数ではうまくいくはずですが、残念ながらこれを管理する方法はありません。

誰かがとても親切で、私に助けを与えることができたら。

jsフィドルは下にリンクされています。

https://jsfiddle.net/dkyun/dfx0grdr/

Answer 1

あなたが何かをあなたのコードをリファクタリングできこのような：

$scope.index = 0; 

    $scope.calcIndex = function(){ 
    return $scope.alerts.reduce(function(prev, next) { 
     return prev + (next.value*next.weight); 
    }, 0); 
    }; 

    $scope.$watch(function(){ 
    return $scope.calcIndex(); 
    }, function(newValue){ 
    $scope.index = newValue; 
    }); 

CHECK THE DEMO FIDDLE

Answer 2

アラートへの変更に基づいて、スコープのインデックスプロパティを更新する場合は、アラートに深い時計を実行する必要があります。

$scope.$watch('alerts', function() { 
    var index = $scope.alerts.reduce(function(prev, next) { 
     return prev + (next.value*next.weight); 
    }, 0); 

    $scope.index = index; 
    console.log(index); 
}, true);