$ घड़ी निर्देश

Question

अंदर केवल एक बार फायरिंग कर रहा है मैं कोणीय जे एस के लिए नया हूँ, इसलिए कृपया कुछ भी मुझे है.मैं मदद मेरी यहाँ टेम्पलेट है:

<form ng-model="signup" form-valid> 
    <input type="text" name="username" ng-model="signup.username">{{signup}} 
</form> 

और मेरे निर्देश इस तरह है:

app.directive("formValid",function(){ 

return { 
    restrict:"A", 
    require:"ngModel", 
    link:function(scope,element,attrs){ 
      scope.$watch(attrs.ngModel,function(newValue){ 
       if(newValue){ 
       console.log(newValue); 
       } 
      }); 
     } 
    }}); 

जब भी मैं टेक्स्ट बॉक्स में कुछ मूल्य डाल रहा हूं तो मॉडल बदल रहा है और तदनुसार "$ घड़ी" निकाल दिया जाना चाहिए। लेकिन यहां "$ घड़ी" को केवल एक बार निकाल दिया जाता है जब पहली बार मैं टेक्स्ट बॉक्स में कोई मान डालता हूं ।अग्रिम में धन्यवाद।

Answer 1

एक समाधान नीचे दिए गए उदाहरण में ngModel का उपयोग करना होगा।

app.directive("formValid",function(){ 
    return { 
    restrict: 'A', 
    require: 'ngModel', 
    link: function(scope, element, attrs, ngModel) { 
     scope.$watch(function() { 
      return ngModel.$modelValue; 
     }, function(newValue) { 
      console.log(newValue); 
     }); 
     } 
    } 
    }); 

संपादित करें: तेज समाधान ब्लैकहोल द्वारा टिप्पणी का पालन करें और true जोड़कर एक गहरी नजर के लिए अपनी घड़ी को अद्यतन करने के लिए होगा। ऐसा इसलिए है क्योंकि आप signup विशेषता देख रहे हैं लेकिन मॉडल मान username साइनअप की एक संपत्ति है। गहरी घड़ी संपत्तियों को देखने के लिए काम करेगा।

का उपयोग attrs के माध्यम से सीधे या स्वरूपक या पार्सर्स के माध्यम से (जैसा कि माइकल्स उत्तर में विस्तृत है मेरे दृश्य में एक बेहतर समाधान है)।

Answer 2

जब आप ngModelController उपयोग करते हैं, मॉडल पर परिवर्तन देखने के लिए मानक तरीका एक formatter बनाने के द्वारा है:

link: function(scope, element, attrs, ngModelCtrl) { 
    ngModelCtrl.$formatters.push(function(value) { 
     // Do something with value 
     return value; 
    }); 
} 

ध्यान रखें कि formatters केवल ट्रिगर कर रहे हैं जब मॉडल सीधे बदला गया है। यदि परिवर्तन यूआई से आता है (यानी उपयोगकर्ता कुछ बदलता है), तो पार्सर्स इसके बजाए ट्रिगर किया गया है। तो आप इस रूप में अच्छी तरह करने की जरूरत हो सकता है:

ngModelCtrl.$parsers.push(function(value) { 
    // Do something with value 
    return value; 
}); 

Working Plunker

मेरा सुझाव है कि आप ngModelController दस्तावेज़ पढ़ें ताकि आप समझ सकें कि कैसे उन पाइपलाइनों काम करते हैं।

लेकिन जब मॉडल परिवर्तन (यदि आप नहीं चाहते या न प्रारूप करने की जरूरत है और न ही कुछ पार्स), तो आप सरल कुछ कर सकते हैं अगर सभी आप क्या करना चाहते सूचित किया जाता है:

scope: { model: '=ngModel' }, 
link: function(scope) { 
    scope.$watch('model', function(value) { 
     // Do something with value 
    }); 
} 

Working Plunker

लेकिन आपके निर्देश का नाम, formValid, मुझे लगता है कि ngModelController का उपयोग सही दृष्टिकोण है।

अद्यतन

यह ngModelController यकीनन कमी है कि उल्लेख के लायक है: यह "संदर्भ" प्रकार (उदा सरणियों, वस्तुओं) के साथ बहुत अच्छी तरह से काम नहीं करता। उस पर अधिक जानकारी here मिल सकती है।