AngularJSの従属フィールドによるフォーム検証

Question

私は2つのフィールドを持つオブジェクトを持っていますが、1は別のオブジェクトと同じでなければなりません。

HDDクォータの設定で、thresholdをHDDのsize以下にする必要があります。

角度のui-utils#validateを使用しようとしています。

これは私がこれまでに得た方法である：http://embed.plnkr.co/EysaRdu2vuuyXAXJcJmE/preview（私はリンクが機能を願っています）

私が午前問題は、それが一つの方向に動作することです：

sizeを設定し、その後thresholdで遊んで正常に動作します

sizeを変更しようとすると、thresholdが無効な状態になった後に何も起こりません。これは無効なthresholdがモデルに設定されておらず、nullまたはundefined（またはそのようなもの）と比較されているsize IDです。

一方、私はモデルに無効​​な値を設定しないという論理を理解しています...しかし、ここではそれは私のやり方です。

ですから、この作業を手助けすることに感謝します。

Answer 1

私はカスタムディレクティブで演奏し、私の場合に適したものを調理しました。 thresholdのための私の入力時に

私は（私はquota.thresholdは以下quota.sizeに等しくなるようにしたい）に対して検証するモデルのプロパティを渡し、less-than-or-equal="quota.size"ディレクティブを持っている：lessThanOrEqualディレクティブそれのlink機能で

<input type="number" name="threshold" 
    ng-model="quota.threshold" 
    required 
    less-than-or-equal="quota.size" /> 

link: (scope, elem, attr, ctrl) -> 
    scope.$watch attr.lessThanOrEqual, (newValue) -> 
     ctrl.$setViewValue(ctrl.$viewValue) 

： quota.sizeとするとき、それはちょうどモデルに thresholdの現在のビューの値を設定しようと quota.size変化を見るために開始

次に、scope.thresholdValidate(thresholdValue)メソッドを呼び出すことで検証を行うパーサーが候補値を渡します。検証が成功した場合、このメソッドはtrueを返し、それがない場合 - 現在のモデルの価値 - それは、そうでない場合は、新しい値を返します。例のほとんどのようにそれをunshiftingと反対として、

ctrl.$parsers.push (viewValue) -> 
     newValue = ctrl.$modelValue 
     if not scope.thresholdValidate viewValue  
      ctrl.$setValidity('lessThanOrEqual', false) 
     else 
      ctrl.$setValidity('lessThanOrEqual', true) 
      newValue = viewValue 
     newValue 

私はパーサコレクションにパーサをプッシュしていますがここで

私はrequiredとnumberディレクティブを検証する角度たいので、私は私が有効と解析された数の持っている（私のために以下の作業を、しかしtext入力のために、私はおそらく、解析作業を行う必要があります）場合にのみ、ここに来るので、であることを示唆しています私の遊び場：http://embed.plnkr.co/EysaRdu2vuuyXAXJcJmE/preview

Answer 2

これよりもずっと遅くなると、フォーム入力要素にng-model-options="{allowInvalid:true}"を追加する必要があります。これは、このようなことを止めるためです。問題は、約束が拒否されたときです。 $qまたは$httpを使用して）、モデルはデフォルトでは更新されません。クレイジーハァッ！私にはこれを働かせる一日の費用がかかります。

私はこの問題のために特別にplunkrを書かれている - ...このコードは良いです http://embed.plnkr.co/xICScojgmcMkghMaYSsJ/preview