Injection de valeur d'un composant à un autre à l'aide du service

Vous pouvez créer un service avec sujet code>. et souscrivez-le comme observable.

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class InjectionService {
    constructor() { }

    private changeSubject = new Subject<any>();

    changeEmitted$ = this.changeSubject.asObservable();

    emitChange(data: {}) {
        this.changeSubject.next(data);
    }

}

Si votre question concerne la communication des composants à l'aide de service que vous pouvez essayer des liens ci-dessous.

Il est toujours préférable de poster votre code éprouvé ou votre code problématique que vous souhaitez résoudre

https://www.dotnetcurry.com/angularjs/1445 / Services angulaires-composant-communication

https://medium.com/@enriquiol/angular-service -Component-communication-4933782af52c

Présumer que vous recherchiez un service Singleton pour partager des valeurs dans votre application, voir ici; https://angular.io/guide/singleton-services

Un exemple rapide en utilisant Un comportement de comportement pour émettre des modifications aux composants intéressés est un suivant: p>

data.service.ts strong> p> xxx pré>

comp1 .commonent.ts strong> p> xxx pré>

comp2.component.ts strong> p>

Component({  })
export class Comp2Component {
    // Inject data service into Comp2Component
    constructor(private dataService: DataService) {

        // Get the current value
        console.log('Comp2Component::: Current value:: ' + dataService.sharedString.getValue());

        // Listen to changes
        dataService.sharedString.subscribe((value) => {
            console.log('Comp2Component::: ' + value);
        });

        // Trigger an update from the Comp2Component every 1 second. This could come from the user UI
        setTimeout(() => dataService.sharedString.next('Component 2 says hi'), 1000);
    }
}

Ne laissez considérer que nous avons deux composants enfant et parent et nous aurons un service commun entre eux qui s'appelle le service commun-data-service.

Service de données commun: P>

import { Component, OnInit } from '@angular/core';
import { CommonDataService } from "../common-data.service";

@Component({
  selector: 'app-sibling',
  template: `
    {{ oldMessage }}
    <br>
    {{ newMessage }}
  `,
})
export class SiblingComponent implements OnInit {

  OldMessage:string = "";
  newMessage:string = "";

  constructor(private data: DataService) { }

  ngOnInit() {
    this.data.currentMessage.subscribe(message => { 
         this.oldMessage = this.newMessage;
         this.newMessage = message; 
    });
    setInterval(
      () => {
        this.newmessage();
      },
      3000
    );
  }

  newMessage() {
    this.data.changeMessage(Math.random().toString(36).substring(7));
  }

}

Cet exemple est l'injection de service dans un autre service à l'aide de @Ijectable Annotation

Le service de compte est injecté du service de journalisation à l'aide de @Injectable () Annotation, et Le service de compte est injecté dans APP.COMPONENT.TS à l'aide de Constructor, assurez-vous également de Ajouter des services dans les fournisseurs Array dans App.Module.ts xxx