2

当地图将其模式更改为暗模式时，我想更改 agm-circle 颜色。

我在服务文件中有如下行为主题

private isDarkModeActiveSubject = new BehaviorSubject<boolean>(false);
readonly isDarkModeActive$ = this.isDarkModeActiveSubject.asObservable();

在我的组件文件中，在 ngOnInit 方法中有以下代码

this.mapToolbarService.isDarkModeActive$
  .pipe(takeUntil(this.unsubscriber.done))
  .subscribe((isDarkModeActive: boolean) => {
    this.changeTheAgCircleColor(isDarkModeActive);
    ComponentChangeUtils.detectChanges(this.changeRef);
  });

然后更改TheAgCircleColor 方法

  changeTheAgCircleColor(isDarkModeActive: boolean) {
    if (isDarkModeActive) {
      this.pickupClusterPoints.forEach((point) => {
        point.fillColor = '#FFCF4D';
        point.strokeColor = '#FFEB3B';
      });
    } else {
      console.log('light mode', isDarkModeActive);
      // this.pickupClusterPoints.forEach((point) => {
      //   point.fillColor = '#333';
      //   point.strokeColor = '#333';
      // });
    }
  }

export interface PickupClusterPoint extends PositioningPoint {
  strokeColor?: string;
  fillColor?: string;
 // some other varibles 
}

HTML 文件

  <ng-container *ngFor="let point of pickupClusterPoints">
    <agm-circle
       
      [strokeColor]="point.strokeColor"
      [strokeWeight]="point.strokeWeight"
      [fillColor]="point.fillColor"
   
    ></agm-circle>

如果暗模式处于活动状态，圆圈颜色会发生变化，但是当我恢复到亮模式时，它保持不变。else 块中的注释代码，如果我取消注释它不起作用，我的意思是订阅者不起作用，因此没有方法调用。单独的 console.log 有效。

4

0 回答 0