zoukankan      html  css  js  c++  java
  • angular 不同组件间通过service传递数据

    //global.service.ts

    import { Injectable } from "@angular/core"
    import { Subject } from "rxjs"
    interface globalModalModel {
      tipMsg?: string
      show?: boolean
      duration?: number
    }
    @Injectable({
      providedIn: "root"
    })
    export class GlobalService {
      constructor() {}
      private globalModal = new Subject<any>()
      globalModal$ = this.globalModal.asObservable()
      updateGlobalModal(data: globalModalModel) {
        this.globalModal.next(data)
      }
    
      public sysTime
      public globalTime = new Subject<any>()
      globalTime$ = this.globalTime.asObservable()
      updateGlobalTime(data: any) {
        this.globalTime.next(data)
        this.sysTime = data
      }
    }

    监听数据变化:

     this.subscription_globalModal = this.GlobalService.globalModal$.subscribe(
          (data) => {
            this.tipMsg = data.tipMsg || ""
            this.globalMaskShow = data.show
            setTimeout(() => {
              this.globalMaskShow = false
            }, data.duration || 3000)
          }
        )

    更新数据:

     this.GlobalService.updateGlobalModal({
                show: true,
                duration: 1000000,
                tipMsg: "服务器连接中断, 正在尝试重新连接....."
              })
  • 相关阅读:
    Redis命令
    Linux命令
    SQL语句
    Redis集群
    Redis主主复制、主从复制
    关于Java乱码
    组合, 封装, 访问限制机制, property装饰器, 多态
    继承
    小练习
    面向过程与面向对象, 类和对象
  • 原文地址:https://www.cnblogs.com/isylar/p/13897870.html
Copyright © 2011-2022 走看看