कोणीय 2 और आयनिक 2: कन्स्ट्रक्टर, ionViewDidLoad और ngOnInit विधियों के बीच अंतर क्या हैं

Question

कन्स्ट्रक्टर, आयन व्यूडिडलोड और ngOnInit विधियों के बीच अंतर क्या हैं। प्रत्येक मामले में कौन सी कार्रवाइयां उचित हैं।

Answer 1

ionic2 constructor के संबंध में: सरल शब्दों में हम इसका उपयोग हमारे प्लगइन, सेवाओं इत्यादि के उदाहरण बनाने के लिए करते हैं उदाहरण के लिए: आपके पास एक पृष्ठ (दृश्य) है जहां आप सभी छात्रों की सूची दिखाना चाहते हैं, और आप एक जेएसएस फ़ाइल है जिसमें सभी छात्र शामिल हैं (यह फ़ाइल आपकी डेटा फ़ाइल है) आपको इस सेवा में सेवा बनाने के लिए क्या करना है, आप एक विधि बनायेंगे और http.get जेसन डेटा प्राप्त करने के अनुरोध को दबाएं, तो यहां आपको आवश्यकता है क्या? अब फिर से हम इस सेवा विधि हम हमारे विचार/पृष्ठ पर जाएँ और होगा उपयोग करना चाहते हैं

import {Http} from '@angular/http'; 
@Injectable() 
export class StudentService{ 
    constructor(public http: Http){} 
    getAllStudents(): Observable<Students[]>{ 
     return this.http.get('assets/students.json') 
     .map(res => res.json().data)  
     } 
    } 

नोटिस निर्माता: http बस इस तरह से करना

import {StudentService} from './student.service'; 
import { SocialSharing } from '@ionic-native/social-sharing'; 
export class HomePage implements OnInit { 

    constructor(public _studentService: StudentService, public socialSharing: SocialSharing) { 
    } 

फिर, यहाँ निर्माता नोटिस हम कन्स्ट्रक्टर में छात्र सेवा का एक उदाहरण बना रहे हैं और एक और बात है, हम सोशलशियरिंग प्लगइन का उपयोग कर रहे हैं ताकि हम इसका इस्तेमाल कर सकें कि हम इसके निर्माता भी बना रहे हैं।

OnInit: यह आयनिक 2 में वास्तव में अद्भुत बात है या हम AngularJs2 में कह सकते हैं। उपर्युक्त उदाहरण के साथ हम देख सकते हैं कि ngOnInit क्या है। तो आप सेवा विधि के साथ तैयार हैं, अब आपके व्यू/पेज में आप चाहते हैं कि छात्र सूची डेटा जैसे ही आपका दृश्य प्रदर्शित हो रहा है, यह पहला ऑपरेशन लोड पर स्वचालित रूप से खुश होना चाहिए, क्योंकि दृश्य लोड लोड होता है छात्र सूची दिखाई देनी चाहिए। तो कक्षा OnInit लागू करती है और आप ngOnInit परिभाषित करते हैं। उदाहरण:

export class HomePage implements OnInit { 
... 
.... 
constructor(....){} 

ngOnInit(){ 
    this._studentService.getAllStudents().subscribe(
    (students: Students[]) => this.students = students, 
    ) 

मुझे आशा है कि यह स्पष्टीकरण इन दोनों के बारे में आपके संदेह को साफ़ करता है। धन्यवाद

Answer 2

हालांकि निक्स का उत्तर उचित जीवन चक्र घटना फायरिंग ऑर्डर, कोणीय टीम recommends against fetching data inside constructors इंगित करता है।

लेकिन अपने प्रश्न का उत्तर देने के लिए, ionViewDidLoad() और ngOnInit() एक ही समय में चलना चाहिए, इसलिए वे अनिवार्य रूप से एक ही चीज़ हैं; हालांकि, ionViewDidLoad()checks for caching:

तो एक पेज छोड़ता है लेकिन कैश किया गया है, तो यह घटना फिर से एक बाद में देखे जाने पर सक्रिय नहीं होगा।

इसी के साथ

भी कार्य के लिए आप कैश्ड नहीं करना चाहते, लेकिन घटक आप प्राप्त अनुरोधों की तरह सामान के लिए ionViewWillEnter(), या ionViewWillLoad() का उपयोग करना चाहिए घुड़सवार हो जाता है/से पहले पर लोड करना चाहते हैं। ionViewWillLoad() has yet to be documented।

Answer 3

निर्माता

एक constructor एक कोणीय सुविधा, यह जावास्क्रिप्ट इंजन द्वारा कहा जाता है नहीं है। खैर, टाइपस्क्रिप्ट में लिखा गया है लेकिन यह एक ईएस 6 अवधारणा है, यह कक्षा जीवन चक्र हुक का हिस्सा है। इसलिए यह जानने के लिए एक अच्छी जगह नहीं है कि कोणीय ने अपने घटकों को शुरू करने के बाद क्या किया है।

किसी भी निर्भरता इंजेक्शन करने के लिए यह सही जगह है।

ngOnInit

ngOnInit एक कोणीय जीवन चक्र हुक है। यह तब निष्पादित किया जाता है जब कोणीय ने घटक स्थापित करना समाप्त कर दिया है। इसका मतलब है कि इस बिंदु पर संपत्ति बाइंडिंग उदाहरण के लिए की जाती है।

यह घटक के लिए कुछ डेटा प्रारंभ करने के लिए एक अच्छी जगह है।

ionViewDidLoad

ionViewDidLoad एक ईओण नेविगेशन जीवन चक्र घटना है। आयनिक में पृष्ठों की एक अवधारणा है। इसमें नेविगेशन तर्क से संबंधित कुछ वर्ग हैं, इसके लिए बेस क्लास NavController है। उनके पास नेविगेशन स्टैक की अवधारणा है, इसलिए पृष्ठों को मूल रूप से स्टैक से धक्का दिया जाता है या पॉप किया जाता है। ionViewDidLoad जैसे नेविगेशन लाइफसाइकिल घटनाओं की इस प्रक्रिया के दौरान निकाल दिए जाते हैं।

आयन व्यूडिडलोड को पृष्ठ लोड होने के बाद बुलाया जाता है। पेज डिफ़ॉल्ट रूप से कैश किए जाते हैं इसका मतलब यह है कि यदि नष्ट नहीं किया जाता है तो यह ईवेंट फिर से नहीं निकाल दिया जाएगा।

यह ध्यान में रखते हुए कि यह पृष्ठ के लिए कोड सेट अप करने के लिए एक अच्छी जगह है।

संदर्भ:

Ionic NavControler

Angular Lifecycle Hooks

ES6 Classes