如何每 30 秒刷新一次 observable？

Question

@Component({
  selector: 'app-geo',
  templateUrl:   <img  mat-card-image [src]="profileUrl | async ">

  export class GeoComponent implements OnInit {
    date;
    profileUrl: Observable<string>;

    constructor(private tempService: TemperatureService, private humService: HumiditeService, public authService: AuthService,private database: AngularFireDatabase, private storage: AngularFireStorage,private router: Router)
    {
      const ref = this.storage.ref('live/live.jpg');
      this.profileUrl = ref.getDownloadURL(); 
    }
  }
})

我在 Firebase 中的图像每 30 秒覆盖一次。如何每 30 秒获取一次 this.profileUrl 的值并将其保存到 Firebase？

如何使用计时器每 30 秒刷新一次我的 observable？

Answer 1

RxJS Interval 和 TakeWhile 运算符的组合将完成这项工作。

类似StackBlitz project example code:

const source = interval(30000).pipe(
  takeWhile(() => { return true }) // here you can have some logic to stop the requests
);
const subscription = source.subscribe(
  (x) => {
    // your code goes here
  },
  function (err) {
    console.log('Error: ' + err);
  },
  function () {
    console.log('Completed');
  });