我正在开发一个Angular应用程序，我在其中实现了使用服务向不同组件发送消息的功能 . 在开发模式下，一切都很好，但在生成构建时，服务不会发送消息 . 下面是我执行的步骤这个功能 .

首先，我创建了一个服务，我创建了一个可观察（主题）对象 . 每个组件都会订阅这个observable，服务将有一个用于发送消息的方法 .

@Injectable()
export class ComponentMessageService  {

    /** message subject */
    private messageSource = new Subject<MyMessage>();

    /** message observable */
    messageSource$ = this.messageSource.asObservable();

    /** broadcastMessage */
    broadcastMessage(message: MyMessage) {
        this.messageSource.next(message);
    }
}

接下来，我创建了一个组件，它将定义订阅服务的通用方法 . 每个组件都将扩展此类 .

export abstract class MessagingComponent{

    disposableObject:any;

    constructor(public componentMessageService:ComponentMessageService){
        this.disposableObject=componentMessageService.messageSource$.subscribe(message => {
                this.handleMessage(message);
        });
    }

    handleMessage(message: MyMessage){

    }

    unsubscribeMethod(){
        this.disposableObject.unsubscribe():
    }
}

最后一步是创建一个实际对象并覆盖handleMessage函数 . 当该组件捕获该消息时，我想更改一个变量以显示一个弹出窗口 .

export class InstructionsPopupComponent extends MessagingComponent{

    constructor(public componentMessageService:ComponentMessageService,
                private changeDetector : ChangeDetectorRef){
        super(componentMessageService);
    }

    handleMessage(message: MyMessage){
        if(message.messageType==MyMessageTypes.DISPLAY){
            this.display=true;
            this.changeDetector.detectChanges();
        }
    }

    ngOnDestroy(){
        this.changeDetector.detach();
        this.unsubscribeMethod();
    }
}

要发送消息，我导入服务，然后调用broadcastMessage . 我正在开发的应用程序是从Jhipster应用程序构建的 .

angular typescript observable subject