2017-06-30 1 views
1

私は、このフィールドは必須です私は、フィールド「ファーストネーム」を持つフォーム、Angularjs - デバウンスとNG-モデルのオプションおよび必要といくつかの条件

<input type="text" name="first_name" ng-model="vm.adminuser.first_name" required aria-invalid="true" ng-change="vm.saveEachField()" ng-model-options="{debounce: 500}"> 

を持って、私はsaveEachField()の後に呼ばれるようにしたいです入力が500ミリ秒に満たない場合(入力が空の場合ではなく)、trueに設定されている変数がある場合に限ります。 {{vm.addPage == true}}

これは可能ですが、saveEachField()にこれらの条件を追加するもう一方の方法は私にとっては長い道のりになります。

答えて

1
<input type="text" name="first_name" ng-model="vm.adminuser.first_name" required aria-invalid="true" ng-change="vm.adminuser.first_name && vm.saveEachField()" ng-model-options="{debounce: 500} 

これは動作するはずです。 ngchangeは有効な場合にのみ呼び出されるためです。現在有効なのは、フィールドに追加した検証内容によって異なります。それ以外の場合は、その変更関数内で処理するのが最善の方法です。

更新:。

userForm.first_name $有効なは間違いなく良いことが、なぜあなたはNG-変化に呼び出している機能で、この一つの条件を追加しないでしょう。複数のフィールドを変更してその関数を呼び出す場合は、&のようなディレクティブを作成して、その変更をsaveEachField()する必要があるすべての入力フィールドに追加します。&テンプレートのng-changeを削除します。

.directive('checkEachField', function() { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
      scope.$watch(attrs.ngModel, function (newValue,oldValue) { 
       //console.log('value changed, new value is: ' + newValue); 
       if(newValue){ 
        scope.saveEachField(); 
       } 
      }); 
     } 
    }; 
}); 

だから、すべてのNG-変更&同じNG-変更関数内に記述あなたの長いngModel変数を減らすだろう。

P.S. 2つ以上のフィールドに対して1つのng-change関数を使用している場合のみ、このソリューションそのスコープを扱う1つのフィールドについては、関数内の可変値は非常に単純でなければなりません。

+0

ありがとうございました:) – user1578460

+1

または他のすべてのバリデーションをカバーするためにng-change = "userForm.last_name。$ valid && vm.saveEachField()"を使用できます。 – user1578460

関連する問題