2016-03-28 13 views
2

私はfcsaNumberディレクティブを使用して、入力ボックスに入力された数字の妥当性をチェックしています。私はこれを有効にしましたが、値の確認は動的です。つまり、どのオプションが選択されているかによって変更することができます。この指令は一度しか初期化されていないようです。オプションが変更されたときに再初期化するには、何をする必要がありますか?あなたが潜在的に問題のディレクティブを取り壊す/初期化するためにng-ifを使用することができAngularディレクティブをどのように再初期化できますか?

//this works fine 
    <input name="Employees" type="text" ng-model="Input.Employees" fcsa-number="{min: 1}" required=""> 

//this only inits once, so its not dynamic 
    <input name="Employees" type="text" ng-model="Input.Employees" fcsa-number="{{getMin()}}" required=""> 

答えて

4

ディレクティブ全体を再構築しても問題ありませんが、ユーザ入力を受け入れるこのようなディレクティブでは特に好ましくありません。ディレクティブを再起動すると吹き飛ばされます。

代わりにあなたはディレクティブがより容易にその属性値の変化に対応できるようにするためにscope.$watchまたはattrs.$observeを使用することができます。

module.directive('foo', function() { 
    return { 
     scope: { 
      'bar': '@' 
     }, 
     link: function(scope, element, attrs) { 
      scope.$watch('bar', function() { 
       // runs when scoped value 'bar' changes 
      }); 
      attrs.$observe('baz', function() { 
       // Similar to $watch, but without isolate scope 
      }); 
     } 
    } 
}); 

AngularJS : Difference between the $observe and $watch methodsは$観察すると$観の違い良い説明があります。

5

。 (ng-if docs

ngIf指令はDOMツリーの一部を除去または再作成 発現に基づきます。 ngIfに割り当てられた式が偽の値に を評価された場合、その後の要素をDOMから削除され、それ以外の要素の クローンはDOMに再挿入される - CodeHater

ここng-ifとの違いに大きなstack overflow answerですおよびng-show

関連する問題