查看: 49|回覆: 0

Angular 创建 可观察对象(Observable)

[複製鏈接]

3

主題

0

回帖

0

積分

热心网友

金币
0
閲讀權限
220
精華
0
威望
0
贡献
0
在線時間
0 小時
註冊時間
2008-7-4
發表於 2020-5-20 12:37:00 | 顯示全部樓層 |閲讀模式
message.service.ts  

// 创建可观察对象
import { Injectable } from '@angular/core';
import {Observable} from 'rxjs';
import { Subject } from 'rxjs';

@Injectable()
export class MessageService {
    private subject = new Subject<any>();

    sendMessage(message: string) {
        this.subject.next({ text: message });
    }

    clearMessage() {
        this.subject.next();
    }

    getMessage(): Observable<any> {
        return this.subject.asObservable();
    }
}
home.component.ts

import { Component } from '@angular/core';
import { MessageService } from 'src/app/service/single.service'
 import { Subscription } from 'rxjs';

@Component({
    templateUrl: 'home.component.html'
})

export class HomeComponent OnDestroy
{
      subscription: Subscription;
    constructor(private messageService: MessageService) {
      // 创建观察者
      this.subscription = this.messageService.getMessage()
              .subscribe(message => { console.log('message', message) });
      this.sendMessage() // 发短信
  }
    
    sendMessage(): void { // 发送消息
        this.messageService.sendMessage('Message from Home Component to App Component!');
    }

    clearMessage(): void { // 清除消息
        this.messageService.clearMessage();
    }

   ngOnDestroy() {
        // 关闭监听
        this.subscription.unsubscribe();
    }

}    

 



来源:https://www.cnblogs.com/lvsk/p/12922914.html
回覆

使用道具 舉報

您需要登錄後才可以回帖 登錄 | 立即注册

本版積分規則

相关侵权、举报、投诉及建议等,请发 E-mail:qiongdian@foxmail.com

Powered by Discuz! X5.0 © 2001-2026 Discuz! Team.

在本版发帖返回顶部