Question

我的代码已被重构，其中一些已提取到预订功能的服务中。但是，我的原始代码在订阅中有一个调用，该调用引用了文件中的变量，但是现在我不确定如何最好地达到它？

我正在为放置线而苦苦挣扎：在this.select.reset('some string');函数中找到subscribeToMessageService()。

原始代码

event.component.ts

select: FormControl;

@ViewChild('mySelect') mySelect: ElementRef;

subscribeToMessageService() {
    this.messageService.serviceMsg
    .subscribe(res => {
      // unrelated code

      this.select.reset('some string');
    });
  }

subscribeToEventService() {
    this.eventService.eventSubject
    .subscribe(res => {
      this.select = new FormControl(res.status);
      this.select.valueChanges.subscribe(value => {
        // manual blurring required to stop error being thrown when popup appears
        this.selector.nativeElement.blur();
        // do something else
      });
    });
  }

重构代码

status.service.ts

subscribeToMessageService(): void {
    this.messageService.serviceMsg
    .subscribe(res => {
      // unrelated code

      // This is where 'this.select.reset('some string');' would have gone
    });
  }

status.component.ts

select: FormControl;

@ViewChild('exceptionalSelect') selector: ElementRef;

subscribeToEventService() {
    this.eventService.eventSubject
      .subscribe(res => {
        this.select = new FormControl(res.status);
        this.select.valueChanges.subscribe(value => {
          // manual blurring required to stop error being thrown when popup appears
          this.selector.nativeElement.blur();
          this.onStatusChange(value);
        });
      });
  }

Answer 1

由于您仍想订阅原始来源messageService.serviceMsg，因此新的StatusService需要将此可观察项公开给注入组件（StatusComponent）。

例如，可以通过在StatusService中创建一个公共可观察对象（可能是通过使用rxjs Subject或角度EventEmitter）并触发{{1 }}。

然后您的messageService.serviceMsg只需要注入StatusComponent并执行

StatusService

订阅更改，但需要查看使用Service的位置的变量？

原始代码

重构代码

1 个答案: