2016-07-20 15 views
5

[angular2 RC4 + @ कोणीय/रूपों मॉड्यूल]कोणीय 2 फॉर्म + async सत्यापन + ChangeDetectionStrategy.OnPush = कोई दृश्य ताज़ा करें?

मैं एक घटक OnPush परिवर्तन एक FormGroup युक्त पहचान का उपयोग करते है। इस फ़ॉर्म में FormControl है async सत्यापनकर्ता के साथ।

जब सत्यापन पूर्ण हो जाता है (pending नहीं), दृश्य रीफ्रेश नहीं होता है। केवल input धुंधला घटना दृश्य ताज़ा करता है ..

यदि मैं OnPush परिवर्तन का पता लगाने को हटा देता हूं, तो यह ठीक से काम करता है।

This plunker demonstrates it

क्या यह एक कोणीय बग है या मैं कुछ गलत कर रहा हूं?

उत्तर

5

ऐसा लगता है कि आप ChangeDetectionStrategy.OnPush का उपयोग करने का लक्ष्य खो रहे हैं।

आपके पास आपके घटक पर कोई @ इनपुट प्रॉपर्टी या | async पाइप नहीं है, लेकिन इनपुट रणनीति अपडेट की गई है (जब एक नई ऑब्जेक्ट के साथ आदर्श में) इस रणनीति के साथ दृश्य स्थिति को अपडेट करने का एकमात्र बिंदु है। तो बस वर्तमान मामले

अद्यतन

के लिए यह से छुटकारा पाने अगर आप अभी भी इस मामले में OnPush का उपयोग करने पर जोर देते हैं, अपेक्षित व्यवहार के लिए आप मैन्युअल रूप से परिवर्तन का पता लगाने को गति प्रदान करना चाहिए।

import {..., ChangeDetectorRef} from '@angular/core'; जोड़ें और इसे कन्स्ट्रक्टर में इसके उदाहरण को इंजेक्ट करें।

अपने विधि में आप इस जोड़ने के लिए:

uniqueNameAsync(control: FormControl): Promise<{[key: string]:any}>{ 
    return new Promise(resolve => { 
     setTimeout(() =>{ 
      resolve(null); 
      this.changeRef.markForCheck(); 
     }, 500); 
    }); 
} 
साथ
+0

'OnPush', देखने ताज़ा को गति प्रदान भी जब घटनाओं एक क्लिक या इनपुट टाइपिंग की तरह घटक के अंदर होता है। प्लंकर में, जब आप टाइप करना शुरू करते हैं तो दृश्य ताज़ा होता है ('लंबित' दिखाई देता है)। और सिंक वैधकर्ता अच्छी तरह से काम करता है .. इसलिए मुझे नहीं पता कि मैं इसे सामान्य व्यवहार या एसिंक मान्यताओं के साथ एक बग पर विचार कर सकता हूं .. – bertrandg

+0

ठीक है, इसलिए यदि आप अभी भी इस मामले में ऑनपश का उपयोग करने पर जोर देते हैं, तो अपेक्षित व्यवहार के लिए आपको ट्रिगर करना चाहिए मैन्युअल रूप से पहचान बदलें। '@ कोणीय/कोर' से 'आयात {..., ChangeDetectorRef} जोड़ें; और इसे कन्स्ट्रक्टर में इसके उदाहरण को इंजेक्ट करें। अपने विधि में आप इस जोड़ने के लिए: 'setTimeout (() => { संकल्प (शून्य); this.changeRef.markForCheck();} , 500)' –

+1

Async निष्पादन केवल परिवर्तन का पता लगाने में आह्वान 'ऑनपश' जब 'के साथ प्रयोग किया जाता है async' जो इस मामले में संभव नहीं है। मुझे यह भी लगता है कि आपको मैन्युअल रूप से परिवर्तन पहचान का आह्वान करने की आवश्यकता है। –

संबंधित मुद्दे