मैं कैसे बना सकता हूँ angularjs एनचेंज हैंडलर तभी कहा जा सकता है जब उपयोगकर्ता टाइपिंग पूरी कर ले




angularjs-ng-change angular-ngmodel (2)

मेरे पास एक input फील्ड है, जहां मैं ngChange के वेरिएंट को लागू करना चाहता ngChange

input फ़ील्ड एक अजाक्स कॉल के साथ बाइंडिंग की तरह है, जब उपयोगकर्ता इनपुट बदलता है, तो सर्वर साइड डेटा को संसाधित करेगा, हालांकि, मैं कॉल को अक्सर नहीं करना चाहता।

उपयोगकर्ता का कहना है कि इनपुट वास्तव में एक स्ट्रिंग है, मैं चाहता हूं कि उपयोगकर्ता द्वारा टाइप किए जाने वाले शब्द को समाप्त करने के बाद ही कॉल किया जाए। फिर भी, मैं धब्बा जैसे घटना का उपयोग नहीं करना चाहता। setTimeout बजाय इसे लागू करने का एक बेहतर तरीका क्या होगा?


Angular> 1.3 में ng-model-options प्रयोग करें

 <input type="text"
         ng-model="vm.searchTerm"
         ng-change="vm.search(vm.searchTerm)"
         ng-model-options="{debounce: 750}" />

बिना ng-model-options - मार्कअप में:

<input ng-change="inputChanged()">

आपके बैकिंग कंट्रोलर / स्कोप में

var inputChangedPromise;
$scope.inputChanged = function(){
    if(inputChangedPromise){
        $timeout.cancel(inputChangedPromise);
    }
    inputChangedPromise = $timeout(taskToDo,1000);
}

तब आपका taskToDo केवल 1000ms के बाद बिना किसी बदलाव के चलेगा।


अपना खुद का निर्देश लिखें- यह केवल आपके द्वारा निर्धारित शर्तों के आधार पर myText पर कमांड चलाएगा

<input my-change-directive type="text ng-model="myText" />

.directive('myChangeDirective',function() {
    return {
        require : 'ngModel',
        link : function($scope,$element,$attrs) {
            var stringTest = function(_string) {
                //test string here, return true
                //if you want to process it
            }
            $element.bind('change',function(e) { 
                if(stringTest($attrs.ngModel) === true) {
                    //make ajax call here
                    //run $scope.$apply() in ajax callback if scope is changed
                }
            });
        }
    }
})




angular-ngmodel