ionic2
सेवाओं का उपयोग करना

टिप्पणियों

@Component({
  templateUrl:"page1.html",
  providers: [MyService]
})

@Component({
  templateUrl:"page2.html",
  providers: [MyService]
})

@Component({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [MyService]
})

विभिन्न पृष्ठों के बीच जानकारी साझा करें

साझा सेवाओं का उपयोग करने के सबसे आसान उदाहरणों में से एक है जब हम अपने एप्लिकेशन के दिए गए पृष्ठ से कुछ डेटा संग्रहीत करना चाहते हैं, और फिर उस डेटा को फिर से लेकिन किसी अन्य पृष्ठ से प्राप्त करें।

एक विकल्प उस डेटा को एक पैरामीटर के रूप में भेजने के लिए हो सकता है (उदाहरण के लिए, यदि एक पृष्ठ दूसरे को कॉल करता है), लेकिन अगर हम उस डेटा को एप्लिकेशन के पूरी तरह से भिन्न भाग से उपयोग करना चाहते हैं, तो ऐसा करना सबसे अच्छा तरीका नहीं लगता है यह। जब साझा सेवाओं को खेलना आता है।

इस उदाहरण में, हम एक सरल सेवा कहा जाता है का उपयोग करने के लिए जा रहे हैं MyService : जो केवल दो सरल तरीके है saveMessage() एक स्ट्रिंग और स्टोर करने के लिए getMessage() इसे फिर से प्राप्त करने के लिए। यह कोड इस कार्य प्लंकर का हिस्सा है जहां आप इसे कार्रवाई में देख सकते हैं।

import {Injectable} from '@angular/core';

@Injectable()
export class MyService { 
  
  private message: string;
  
  constructor(){ }
  
  public saveMessage(theMessage: string): void {
    this.message = theMessage;
  }
  
  public getMessage(): string {
    return this.message;
  }
}

फिर, जब हम एक नया संदेश संग्रहीत करना चाहते हैं, तो हम केवल saveMessage(theMessageWeWantToSave); उपयोग कर सकते हैं saveMessage(theMessageWeWantToSave); MyService उदाहरण (सिर्फ service कहा जाता है) से विधि।

import { Component } from "@angular/core";
import { MyService } from 'service.ts';

@Component({
  templateUrl:"page1.html"
})
export class Page1 {
  
  message: string;
  
  // ... 
   
  public saveSecretMessage(): void {
    this.service.saveMessage(this.message);
  }      
}

उसी तरह, जब हम उस डेटा को प्राप्त करना चाहते हैं, तो हम इस तरह से सेवा उदाहरण से getMessage() विधि का उपयोग कर सकते हैं:

import { Component } from "@angular/core";
import { MyService } from 'service.ts';

@Component({
  templateUrl:"page2.html"
})
export class Page2 {
  
  enteredMessage: string;
  
  constructor(private service: MyService) {
    this.enteredMessage = this.service.getMessage();
  }
    
  // ...
}

कृपया यह देखने के लिए रिमार्क्स अनुभाग देखें कि MyService सेवा के लिए संदर्भ कहाँ और क्यों शामिल होना चाहिए।