2

基本的に要素の値を監視するディレクティブがあります。

この要素にはng-maxlength、150 に設定された属性があります。150 文字を渡すと、$watchトリガーされなくなりました。さらに、ctrl + x でテキスト全体を削除すると、$watch再びトリガーされません。

入力要素 

<input type="text" ng-model="company.fullName" name="companyFullName" required ng-maxlength="150" ng-input-validate />

指令

enlabApp.directive('ngInputValidate', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attrs, ctrl) {
            scope.$watch(function () { return ctrl.$modelValue; }, function (value) {
                 console.log('test');
            });
        }
    };
});

ng-maxlengthディレクティブを削除すると、問題はなくなります。

4

2 に答える 2

4

どの平均角度を使用しng-maxlength=150て、文字数の検証を実行し、それに$modelValue応じて更新します。無効な場合 (長さが超えた場合)$modelValueを意味undefinedし、実行して値を削除し、ダイジェスト サイクルが実行され、値が存在せず、前の値との違いがなく、ウォッチャーがないためctl-x、再びモデル値になります。undefinedトリガー (ウォッチャーはmodelValueがダーティになった場合にのみトリガーされます)。

したがって、$viewValueまたはelement[0].valueを使用します（私はお勧めしません）。そうする： -

        scope.$watch(function () { 
          return ctrl.$viewValue; 
        }, function (value) {
          console.log('Triggered');
        });
  • $viewValue: ビュー内の実際の文字列値。
  • $modelValue: コントロールがバインドされるモデル内の値。

使用ng-minlengthは検証のみを目的としており、ユーザーがさらに文字を入力/貼り付けすることを制限するものではないことに注意してください。属性を制限したい場合minlengthは、行く方法です

また、追加のウォッチを作成する代わりにngModel使用できるウォッチを登録する必要がないことにも注意してください。$viewChangeListeners

ビューの値が変更されるたびに実行する関数の配列。引数なしで呼び出され、戻り値は無視されます。これは、モデル値に対して追加の $watches の代わりに使用できます。

ctrl.$viewChangeListeners.push(function(){//... });
于 2014-08-21T17:07:35.577 に答える