[解決済み] Angularjs: input[text] ngChangeは値が変化している時に発生します。

質問

ngChangeは値が変化している間、発射されます（ngChangeは古典的なonChangeイベントと似ていません）。コンテンツがコミットされたときにのみ発生する古典的なonChangeイベントをangularjsでバインドするにはどうすればよいですか？

現在のバインディング。

<input type="text" ng-model="name" ng-change="update()" />

どのように解決するのですか？

この記事 が表示されるまで入力に対するモデルチェンジを遅らせるディレクティブの例を示します。 ぼかし イベントが発生するまで、入力に対するモデルの変更を遅らせるディレクティブの例を示します。

ここで は、新しい ng-model-on-blur ディレクティブで ng-change が動作していることを示すフィドルです。これは オリジナルのフィドル .

ディレクティブをコードに追加すると、バインディングをこのように変更することになります。

<input type="text" ng-model="name" ng-model-onblur ng-change="update()" />

以下はディレクティブです。

// override the default input to update on blur
angular.module('app', []).directive('ngModelOnblur', function() {
    return {
        restrict: 'A',
        require: 'ngModel',
        priority: 1, // needed for angular 1.2.x
        link: function(scope, elm, attr, ngModelCtrl) {
            if (attr.type === 'radio' || attr.type === 'checkbox') return;

            elm.unbind('input').unbind('keydown').unbind('change');
            elm.bind('blur', function() {
                scope.$apply(function() {
                    ngModelCtrl.$setViewValue(elm.val());
                });         
            });
        }
    };
});

注: 以下のコメントで @wjin が言及しているように、この機能は Angular 1.3 (現在ベータ版) で直接サポートされています。 ngModelOptions . 参照 ドキュメントを参照してください。 を参照してください。