angular - 将代码从 Angular/RXJS 4 重写为 6

Question

我很难为 Angular 6 重写这段代码。我的 Angular 应用程序经常出现 RXJS 库错误。我什至尝试安装 Rxjs-compat，但到目前为止，还没有解决任何问题。

public publicar(): void {
    this.bd.publicar({
      email: this.email,
      titulo: this.formulario.value.titulo,
      imagem: this.imagem[0]
    })

    let acompanhamentoUpload = Observable.interval(1500)

    let continua = new Subject()

    continua.next(true)

    acompanhamentoUpload
      .takeUntil(continua)
      .subscribe(() => {
        //console.log(this.progresso.status)
        //console.log(this.progresso.estado)
        this.progressoPublicacao = 'andamento'

        this.porcentagemUpload = Math.round(( this.progresso.estado.bytesTransferred / this.progresso.estado.totalBytes ) * 100)

        if(this.progresso.status === 'concluido') {
          this.progressoPublicacao = 'concluido'
          //emitir um evento do componente parent (home)
          this.atualizarTimeLine.emit()
          continua.next(false)
        }
      })
  }

标签： angularrxjs

Answer 1

问题在于 .takeUntil(continua)您必须将其更改为.pipe(takeUntil(continua)) 您还必须像这样导入它：

import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';

你的代码会是这样的：

public publicar(): void {
    this.bd.publicar({
      email: this.email,
      titulo: this.formulario.value.titulo,
      imagem: this.imagem[0]
    })

    let acompanhamentoUpload = Observable.interval(1500)

    let continua = new Subject()

    continua.next(true)

    acompanhamentoUpload
    .pipe(takeUntil(continua))
      .subscribe(() => {
        //console.log(this.progresso.status)
        //console.log(this.progresso.estado)
        this.progressoPublicacao = 'andamento'

        this.porcentagemUpload = Math.round(( this.progresso.estado.bytesTransferred / this.progresso.estado.totalBytes ) * 100)

        if(this.progresso.status === 'concluido') {
          this.progressoPublicacao = 'concluido'
          //emitir um evento do componente parent (home)
          this.atualizarTimeLine.emit()
          continua.next(false)
        }
      })
  }