मैं आईओनिक 2 में अपने रूट पेज पर डेटा कैसे वापस भेज सकता हूं?

Question

मेरे पास एक आयनिक 2 ऐप है। ऐप का आधार कक्षा लेना है। एक बार कक्षा खोले जाने के बाद उपयोगकर्ता को इस श्रेणी को रिमोट एपीआई में लेने के रूप में चिह्नित किया जाता है।

डेटा का प्रवाह है:

1. उपयोगकर्ता 'वर्ग' टैब को खोलता है।
2. ऐप एपीआई से 'क्लासेस' डेटा अनुरोध करता है। प्रत्येक वर्ग में उस उपयोगकर्ता के लिए 'स्थिति' होती है।
3. उपयोगकर्ता एक वर्ग का चयन करता है। यह NavController.push(Page, { 'classes': classObjFromApi }); का उपयोग कर ऐप में एक नया दृश्य खुलता है।
4. ढेर करने के लिए जोड़ा कुछ पन्नों के होते हैं, प्रत्येक classes वस्तु इसे करने के लिए पारित कर दिया है। '(स्थिति में दिखाया गया है' शुरू नहीं हुआ
5. अंतिम पृष्ठ पर एपीआई सूचित किया जाता है कि वर्तमान वर्ग लिया गया है और उपयोगकर्ता वापस जड़ को जड़ पेज प्रत्येक वर्ग पर NavController.popToRoot()

का उपयोग कर नेविगेट कर सकते हैं ' , 'प्रगति में', 'पूरा')। उपर्युक्त प्रवाह में बिंदु 5 पर उपयोगकर्ता को रूट पर वापस ले जाया जाता है, लेकिन इसका मूल रूप से निर्माण होने के बाद से डेटा होता है, जो कक्षा को 'शुरू नहीं हुआ' दिखाता है, भले ही यह अब 'पूर्ण' हो।

मैं कैसे ढेर में किसी भिन्न पृष्ठ से जड़ पृष्ठ पर डेटा अद्यतन कर सकते हैं? मैंने माना था कि popToRoot()navParams स्वीकार करेगा, इसलिए मैं रूट पेज में उस डेटा की उपस्थिति की जांच कर सकता हूं और यदि यह मौजूद है या एपीआई से अनुरोध है तो इसका उपयोग करें।

मैं ionViewDidEnter विधि पर एपीआई से डेटा का पुन: अनुरोध करके इसे प्राप्त कर सकता हूं, लेकिन इसका मतलब यह है कि उपयोगकर्ता द्वारा इस पृष्ठ को देखने पर हर बार एक एपीआई/HTTP अनुरोध होता है, भले ही ऐप में डेटा हो। गंदा लगता है।

मैं नहीं बल्कि मोबाइल मेमोरी का उपयोग नहीं करना चाहते हैं अगर मैं इसे मदद कर सकते हैं, के रूप में यह एक देरी जब, पेज लोड हो रहा है के रूप में मैं डेटा यह प्रदर्शित करने से पहले भंडारण से खींचा जा करने के लिए इंतजार करना पड़ता है बनाता है।

तो मेरे सवाल: क्या ऐसा करने का सबसे अच्छा तरीका है? यदि यह दृश्य में डेटा पास करना है, तो मैं यह कैसे कर सकता हूं यदि popToRoot() नौसेना पैरा का समर्थन नहीं करता है?

Answer 1

करने के लिए कि Events का उपयोग करके सबसे अच्छा तरीका होगा:

अपने मूल पृष्ठ में, एक कस्टम घटना की सदस्यता, कुछ कोड हर बार है कि घटना प्रकाशित किया जाता है निष्पादित करने के लिए:

import { Events } from 'ionic-angular'; 

constructor(public events: Events) { 
    events.subscribe('status:updated', (updatedData) => { 
    // You can use the updatedData to update the view 
    // ... 
    }); 
} 

// Clean up the subscription when the page is about to be destroyed 
ionViewWillUnload() { 
    this.events.unsubscribe('status:updated'); 
} 

और किसी अन्य पेज, में है कि घटना प्रकाशित उपयोगकर्ता है कि डेटा बदल जाता है जब:

import { Events } from 'ionic-angular'; 

constructor(public events: Events) {} 

yourMethod(): void { 
    // Your custom logic... 
    // ... 

    // Now you can publish the event to update the root page (and any other page subscribed to this event) 
    this.events.publish('status:updated', updatedData); 
} 

---

संपादित

ऐसा करने के लिए, एक साझा सेवा का उपयोग कर, और प्रकाशित/परिवर्तन की सदस्यता के लिए एक Subject का उपयोग करके किया जाएगा एक और तरीका है। नतीजा आयनिक इवेंट का जैसा ही होगा, लेकिन इस परिदृश्य में आपको एक साझा सेवा जोड़नी होगी और फिर डेटा अपडेट होने पर इसका उपयोग करना होगा।मैं आयोनिक घटनाक्रम पसंद करते हैं, लेकिन सिर्फ मामले में, यह कैसे आप यह कर सकता है: अपने मूल पृष्ठ में तो अब

import { Subject } from 'rxjs/Subject'; 

@Injectable() 
export class MySharedService { 
    public onDataChange: Subject<any>; 

    constructor() { 
    this.onDataChange = new Subject<any>(); 
    } 

    public publishUpdate(newData): void { 
    // Send the data to all the subscribers 
    this.onDataChange.next(newData); 
    } 
} 

, साझा सेवा का उपयोग परिवर्तन करने के लिए सदस्यता

import { Subscription } from 'rxjs/Subscription'; 

// ... 

private onDataChangeSubscription: Subscription; 

constructor(public mySharedService: MySharedService) { 
    this.onDataChangeSubscription = mySharedService.onDataChange.subscribe(
    updatedData => { 
     // You can use the updatedData to update the view 
     // ... 
    }); 
} 

// Clean up the subscription when the page is about to be destroyed 
ionViewWillUnload() { 
    this.onDataChangeSubscription.unsubscribe(); 
} 

और आप जब किसी अन्य पृष्ठ से डेटा को अद्यतन करने के लिए साझा सेवा भी उपयोग करने की आवश्यकता होगी:

constructor(public mySharedService: MySharedService) {} 

yourMethod(): void { 
    // Your custom logic... 
    // ... 

    // Now you can publish the event to update the root page (and any other page subscribed to this event) 
    this.mySharedService.publishUpdate(updatedData); 
} 

यह दृष्टिकोण बेहतर हो सकता है अगर आप कुछ कस्टम तर्क हर बार डेटा अद्यतन किया जाता है पर अमल करने की जरूरत है, तो घ के बजाय प्रत्येक उपभोक्ता पर, आप इसे साझा सेवा में ही कर सकते हैं, और परिणाम प्रसारित कर सकते हैं ...