在 Rxjs 和 angular 上我該怎么做和有條件地完成

Question

您好，目前我正在使用 observable 來獲取設備的屏幕尺寸並確定它是移動設備還是桌面設備，但我想通過使用 take(0) 添加條件完成，但我現在不這樣做。 目前這是我的代碼

import { BreakpointObserver, BreakpointState } from '@angular/cdk/layout';
import { Component, Input, OnInit } from '@angular/core';
import { take } from 'rxjs';

@Component({
  selector: 'app-sidebar',
  templateUrl: './sidebar.component.html',
  styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit {


  @Input() observerMode: boolean = false;

  isMobile: boolean = false;
  constructor(private breakpointObserver: BreakpointObserver) { }

  ngOnInit(): void {
    this.breakpointObserver
      .observe(['(min-width: 750px)'])
      .pipe(take(0))
      .subscribe((state: BreakpointState) => {
        if (state.matches) {
          console.log('desktop');
          this.isMobile = false;
        } else {
          this.isMobile = true;
        }
      });
  }

}

如果observerMode 為false，我想使用take(0)。

Answer 1

您可以在觀察者模式中使用“takeWhile()”

Answer 2

聽起來您想在observerMode模式為假時防止排放。 在這種情況下，您可以只使用filter ：

    this.breakpointObserver
      .observe(['(min-width: 750px)'])
      .pipe(filter(() => this.observerMode)
      .subscribe(state => this.isMobile = state.matches);