2016-05-18 4 views
0

私は動的な多数のサブフォームを持つAngularフォームを持っています。最初のフォームは送信後にリセットされず、サブフォームは送信ごとにリセットされます。

ユーザーがページを再読み込みしないと、このフォーム全体を複数回使用できます。 検証と送信の後、私は最初のフォームをリセットしませんが、ユーザーがもう一度それをクリックできるようにします。何も変更がなければ追加のサブフォームを追加できます。

ユーザーがサブミットをクリックした場合にのみ検証が表示されるため、スコープ変数subFormSubmittedはtrueになり、必要なエラーは引き続きtrueになります。例えば

subForm.salutation.$error.required && subFormSubmitted 

最初のページロード時にすべて正常に機能します。入力しないでサブフォームを送信しようとすると、必要な検証が表示されます。

問題は、最初にフォームを送信した後、最初のフォームで何も変更しないで、2回目に動的フォームになり、何かを入力せずにsubmitをクリックするだけです。スコープ変数に正しい値が設定されていても、モデルは更新されず、検証も表示されません。

subForm.salutation.$error.required && subFormSubmitted 

がtrueと評価された変数は、私がwebdeveloperでそれを確認するとき。しかし、入力にフォーカスを当てて入力すると、必要な検証がすぐに他の入力に表示されます。また、最初のフォームで何かを変更してサブフォームを入力すると、submitを押すと検証が正しく表示されます。

私は、スコープを適用することで問題になる可能性があると考えました。

は、私はいくつか試してみるとエラーの後、私は機能するソリューションだ何をしたか:

を私が提出押したときに呼び出されるスコープ機能に

if (!$scope.$$phase) { 
    $scope.$digest(); 
} 

を追加しました。

これはうまく動作しますが、いくつかの研究の後、私はこれはアンチパターンであることが判明: Why is using if(!$scope.$$phase) $scope.$apply() an anti-pattern?

だから、誰かが私を助け、この問題を解決するための「正しい」方法だものを私に言うことができますか?

基本的には、ng-show = firstFormSubmittedを使用してフォームの表示を制御します。 AJAXリクエスト、setTimeout/setInterval:私は(最初のダイジェストサイクル後)非同期で実行コールバックで実行すること

+0

あなたが記述している状況、好ましくはフィドル/プランクの形で[MCVE](http://stackoverflow.com/help/mcve)を提供してください。 – estus

答えて

0

$scope.$apply$scope.$digestの悪い英語のため申し訳ありませんが意図されている、あなたは私の問題を理解することを願ってい

$scope.addSubForm = function() { 
      $scope.firstFormSubmitted = true; 

/setImmediateなど$q約束、DOMのイベントリスナー、非

これは、すべての非同期組み込み関数で自動的にそれを行うためのフレームワーク($http、のように角の仕事です、ディレクティブ)、ジョブを処理します。まあ気を付けたサードパーティの拡張機能も同じことです。

コードダイジェストに対して行わか、したがって、このチェックが冗長である場合!$scope.$$phase && $scope.$digest()はアンチパターンと考えることができる理由は、ウェル状アプリの開発者は常に知っていることです。そうでない場合、これはアプリケーション設計の欠陥の指標です。