私は自分のアプリケーションで標準的なHTMLのカラーピッカーを使用し

Question

カラーピッカーでモデルの更新の数を減らします頻繁に更新されました。私はvm.currentUser.colorの時計を持っているので、対応するメソッドも非常に頻繁に呼び出され、それは問題です。

カラーピッカーの[OK]ボタンをクリックしたときにのみモデル変数を設定する方法はありますか？

Answer 1

変更は（あなたがポップアップ内の色を変更した回数に関係なく）が発生した場合は、カラーポップアップが閉じられた後にのみトリガーとして、そのフィールドにng-changeを使用してすることができます：http://plnkr.co/edit/AjDgoaUFky20vNCfu04O?p=preview

を

angular.module('app', []) 
 
    .controller('Ctrl', function($scope, $timeout) { 
 
    $scope.x = '#ff0000'; 
 
    $scope.res = ''; 
 
    $scope.a = function(x) { 
 
     console.log(x); 
 
     $scope.res = 'Color changed to ' + x; 
 
     $timeout(function(){$scope.res = ''}, 2000); 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="Ctrl"> 
 
    <input type="color" ng-model="x" ng-change="a(x)"> 
 
    <p>{{res}}</p> 
 
</div>

Answer 2

はAngularJS 1.3.0-beta.6ので、完全に、ngModelOptionsディレクティブがありますあなたの問題に適しています。それはあなたが探しているものを完全にモデルの更新が行われている方法を調整することができます。

たとえば、妥当な時間が経過しても値が変更されない場合のみ、モデルを更新できます。実際に効果を出すためにここでは500ミリ秒の値を使用しますが、実際には低い方が適切です。

<input 
    type="color" 
    ng-model="color" 
    ng-model-options="{debounce: 500}" 
/>