Обход с наблюдаемыми и подписками

Question

Я использую Angular6, ниже мой сценарий:

Я пытаюсь передать информацию между Component1 и COmponent2 через сервис.Я вижу, что служба получает сообщение от Component1, но Component2 не получает переданное сообщение.

На странице 1:

// когда происходит перемещение мыши в определенной области, этот метод называется

actionMove: function(evt,obj) {  
    var messService = new MessService();
    messService.sendMessage('Sending message from Component1 to Component2!'); 
}

в файле inMessService:

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

@Injectable({ providedIn: 'root' })
export class MessService {
    private subject = new Subject<any>();

    sendMessage(message: string) { 

        console.log("*** service got message from component 1 ***");
        this.subject.next({ text: message });
    }

    getMessage(): Observable<any> {  // this communicates with component2
        console.log("*** component 2 trying to get message ***");
        return this.subject.asObservable();
    }
}

В компоненте 2:

constructor(private messService: MessService) { 
    // subscribe to message service method  
    this.subscription = this.messService.getMessage()
        .subscribe(message => { this.message = message; });

Не могли бы вы помочь мне понять, что мне не хватает?

Answer 1

Комментарий fridoo относится к его сути -

, чтобы использовать службу в нескольких компонентах, вам необходимо воспользоваться преимуществами внедрения зависимостей angular.вы хотите сослаться на свой класс обслуживания в конструкторе, как в вашем component2 в component1, таким образом, оба компонента используют один и тот же MessService.

, вы можете просто создать пустой конструктор, например

constructor(private messService: MessService) {}

чтобы получить услугу - вы пытались это сделать?

Answer 2

Я не специалист по Angular, но я думаю, что вы используете здесь два разных экземпляра MessService, потому что вы создали новый в actionMove в component1 и вставили другой в component2, поэтому работа с одним не отражается в другом.

Попробуйте внедрить MessService в component1, также используя инъекцию конструктора, как предлагает fridoo.Поскольку вы предоставляете свои услуги в корне, вы получаете одноэлементный.

Одноэлементный сервис - Angular