कोणीय 2 - अद्यतन ngModel @HostListener ('कलंक')

Question

पर एक कस्टम निर्देश के अंदर मुझे लगता है कि केवल संख्या को स्वीकार करता है एक कस्टम निर्देश दिया है। जब मैं 1.2 इनपुट करता हूं, तो यह अच्छा होता है। लेकिन जब मैं केवल 1 टाइप करता हूं। मैं धुंधला पर इनपुट 1 मिटा देना चाहता हूं। मैंने onBlur के अंदर मूल्य को खाली स्ट्रिंग पर सेट करने के तरीके पर कई तरीकों का प्रयास किया है लेकिन अभी भी कोई भाग्य नहीं है। यहां कोड स्निपेट है:

@Output() ngModelChange = new EventEmitter(); 

constructor(el: ElementRef, public model: NgControl){ 
//Instead of NgControl, I have also tried the NgModel but it did not work 
this.el = el.nativeElement; 
} 

@HostListener('blur', ['$event']) onBlur($event){ 
if(isNaN(this.el.value.replace(/(,)/g, '')) || this.el.value[this.el.value.length - 1] === '.' || this.el.value[this.el.value.length - 1] === '-'){ 
    this.el.value = ''; 
    this.model.control.updateValue(''); 
    this.model.viewToModelUpdate(''); 
    this.ngModelChange.emit(''); 
} 
} 

यह इनपुट फ़ील्ड में 1. मिटा देता है। लेकिन जब मैं ngModel के मान को मुद्रित करता हूं जो डेटा रखता है, तो मान 1

उस स्थिति में, मैं ngModel मान को खाली स्ट्रिंग पर सेट करना चाहता हूं। मैं धुंध के अंदर ऐसा कैसे कर सकता हूं?

धन्यवाद!

Answer 1

आप बना सकते हैं और तत्व पर एक परिवर्तन घटना को ट्रिगर मॉडल मान अपडेट कोणीय बताने के लिए कर सकते हैं।

let event: Event = document.createEvent("Event"); 
event.initEvent('input', true, true); 
Object.defineProperty(event, 'target', {value: this.el.nativeElement, enumerable: true}); 
this.renderer.invokeElementMethod(this.el.nativeElement, 'dispatchEvent', [event]); 

Answer 2

मुझे लगता है कि prober समाधान custom form controls का उपयोग किया जा सकता है। हालांकि मैंने कभी उनका इस्तेमाल नहीं किया।

this.change.emit(event); फायरिंग बात करना चाहिए और मेरे लिए काम कर रहा है। जादू है कि आप घटना और नहीं मूल्य और मूल्य बदल event.target.value के भीतर होना चाहिए फेंकना है।

इसलिए उदाहरण के लिए

let onChangeCallback = (e) => { 
    console.log("change", e); 
    this.ngModelChange.emit(e); 
    this.change.emit(e) 
}; 

ताकि आप कोशिश करना हो सकता है:

$event.target.value = "", 
this.change.emit($event); 

विस्तृत पढ़ने के लिए मैं introduction into angular2 two way data binding बहुत मददगार के रूप में इस ब्लॉग पोस्ट लगा।