कोणीय 2: ngModel

Question

के साथ पाइप का उपयोग करना मैं [(ngModel)] के साथ अपने रूपों में से एक में JQuery इनपुटमास्क का उपयोग कर रहा था, लेकिन किसी कारण से वे एक साथ काम नहीं करेंगे। किसी एक का उपयोग करके स्वयं पूरी तरह से ठीक काम करता है, लेकिन दो संयोजनों को मिलाकर पूरी तरह से [(ngModel)] तोड़ता है और नए इनपुट घटक पर वापस नहीं भेजे जाते हैं। थोड़ी देर के लिए संघर्ष करने के बाद मैंने एंगुलर 2 के पाइप का उपयोग करके एक अच्छा समाधान किया, हालांकि मैं यह नहीं समझ सकता कि उन दोनों को एक साथ काम करने के लिए कैसे प्राप्त किया जाए।

यहाँ अगर मैं 12345 में टाइप करें, <p> टैग नीचे 12,345.00 दिखाएगा, जो वास्तव में कैसे मैं इसे फ़िल्टर करना चाहते हैं, लेकिन मैं डॉन 'कुछ कोड मैं अपने पाइप

<input [(ngModel)]="Amount" id="Amount" name="Amount" class="form-control" type="number" autocomplete="off"> 
<p>Amount: {{Amount | number:'1.2-2'}}</p> 

के परीक्षण के लिए उपयोग कर रहा हूँ है इनपुट के नीचे फ़िल्टर की गई राशि नहीं चाहते हैं, मैं चाहता हूं कि इनपुट स्वयं 12,345.00 प्रदर्शित करे। ngModel पर उसी पाइप को जोड़ने के लिए: [(ngModel)]="Amount | number:'1.2-2'" मुझे निम्न त्रुटि देता है।

Parser Error: Cannot have a pipe in an action expression at column 10 in [Amount | number:'1.2-2'=$event]

मैं कैसे पाइप (या इनपुट मास्क) का उपयोग कर सकते [(ngModel)] साथ एक इनपुट के अंदर?

Answer 1

[(ngModel)] [ngModel] और (ngModelChange) के लिए एक छोटा सा हाथ है। आप उन्हें अलग अगर यह काम करना चाहिए (यह async पाइप के साथ पक्का काम करता है):

[ngModel]="Amount | number: '1.2-2'" (ngModelChange)="updateAmount($event)"