Rxjs调用管道中的另一个订阅，并从angular中的根订阅更改varible

import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';

@Component({
  selector: 'app-root',
  template: `
    <button (click)="changeVariable()">Change Variable</button>
  `,
})
export class AppComponent {
  variable: string = 'initial value';

  changeVariable() {
    // 创建一个新的Observable，用于模拟从根订阅更改变量
    const rootObservable = new Observable<string>((observer) => {
      setTimeout(() => {
        this.variable = 'new value';
        observer.next(this.variable);
        observer.complete();
      }, 1000);
    });

    // 使用switchMap操作符将根Observable转换为另一个Observable，并订阅它
    rootObservable.pipe(
      switchMap((value) => {
        // 在这里可以进行一些其他的操作，例如调用API获取数据
        return this.anotherObservable(value);
      })
    ).subscribe((result) => {
      console.log(result);
    });
  }

  anotherObservable(value: string): Observable<string> {
    // 创建另一个Observable，用于模拟从管道中调用另一个订阅
    return new Observable<string>((observer) => {
      setTimeout(() => {
        const transformedValue = value.toUpperCase();
        observer.next(transformedValue);
        observer.complete();
      }, 1000);
    });
  }
}