2016-03-24 10 views
0

何かが変更されるたびにデータを保存する必要があるフォームがあります。私はすべてのフォーム要素にng-changeを使ってフォームの検証と保存をトリガーしました。しかし、ラジオボタンの場合は、実際の値が更新される前にng-changeがトリガーされます。その結果、最初の試行では無効な形式になり、それ以降の古い形式になります。値が更新される前にng-changeがトリガーされました

私はこれを説明するためにJSFiddleを設定しました。コンソールは、フォームが有効かどうかを表示します。 $scope.form.test.$modelValueの値を印刷する場合も同様です。

// HTML 
<div ng-controller="MyCtrl"> 
    <form name="form"> 
    <input type="radio" name="test" ng-model="test" value="yes" required ng-change="checkRadios()" /> Yes<br/> 
    <input type="radio" name="test" ng-model="test" value="no" required ng-change="checkRadios()"/> No 
    </form> 
</div> 

// JS 
var myApp = angular.module('myApp',[]); 

function MyCtrl($scope) { 
     $scope.test = null; 
    $scope.checkRadios = function(){ 
     console.log($scope.form.test.$modelValue); 
    } 
} 

ロジックに問題がありますか、これは有効なバグですか、または期待どおりですか?最後のケースでは、常に実際の価値を得るために何をすることができますか?

答えて

1

あなたは$scope.formの更新された値を取得するために遅延を必要とするので、彼らがいるようですので、私は通常、このような場合にタイムアウトを使用しないよう$timeout

http://jsfiddle.net/loen22/w7dpx57f/

$scope.checkRadios = function(){ 
    $timeout(function() { 
    console.log($scope.form.$valid); 
    }); 
} 
+0

を使用することによって達成することが可能ですハッキーですが、残念ながら私は代替案が見当たらないので、これを実行して実装します。ありがとう。 –

+1

実際に$ timeoutは、次のダイジェストサイクルでコールバックを実行するようにキューに入れるので、現在のダイジェストサイクルでは '$ scope.form'の更新が実行されます。これにより$ timeoutはよりハッキリになりません:) –

関連する問題