Angular 为什么要在共享服务中使用Subject或behavior Subject，没有可观察性就不能实现吗？

为了在组件之间共享数据，我们使用共享服务，可以观察到Subject或BrhaviorSubject，如下所示

import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';

@Injectable()
export class DataService {
    private subject = new Subject<any>();

    // Method to set navmenu //
    public sendData(data: boolean) {
        this.subject.next(data);
    }

    // Method to clear navmenu //
    public clearData() {
        this.subject.next();
    }

    // Method to get navmenu //
    public getData(): Observable<any> {
        return this.subject.asObservable();
    }
}

class EmailService{
  public apiKey: string = 'ABCD1234';
}

@Component({
  selector: 'component-a',
  template: `
  Component A - {{emailService.apiKey}}
  <button (click)="changeApiKey()">Change Key</button>
  `
})

export class A{
  public emailService: EmailService;
  constructor(emailService: EmailService){
    this.emailService = emailService;
  }

  changeApiKey(){
    this.emailService.apiKey = "XYZ1234";
  }
}

@Component({
  selector: 'component-b',
  template: `
  Component B - {{emailService.apiKey}}
  <button (click)="changeApiKey()">Change Key</button>
  `
})

export class B{
  public emailService: EmailService;
  constructor(emailService: EmailService){
    this.emailService = emailService;
  }

  changeApiKey(){
    this.emailService.apiKey = "ABCD1234";
  }
}

@Component({
  selector: 'app-root',
  template: `

    <component-a></component-a>
    <br />
    <component-b></component-b>
  `,
  providers: [
    EmailService
  ]
})

export class AppComponent {

}

Can someone please explain why most of the examples and tutorials use observable in shared service. What's the advantage in using that ??

但我们可以在不使用主体或行为主体的情况下达到同样的效果。 在下面的示例中，组件A和组件B都共享EmailService实例，因此如果组件A更改了值EmailService.apiKey，则组件B中会反映相同的值，反之亦然，如下所示

import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';

@Injectable()
export class DataService {
    private subject = new Subject<any>();

    // Method to set navmenu //
    public sendData(data: boolean) {
        this.subject.next(data);
    }

    // Method to clear navmenu //
    public clearData() {
        this.subject.next();
    }

    // Method to get navmenu //
    public getData(): Observable<any> {
        return this.subject.asObservable();
    }
}

class EmailService{
  public apiKey: string = 'ABCD1234';
}

@Component({
  selector: 'component-a',
  template: `
  Component A - {{emailService.apiKey}}
  <button (click)="changeApiKey()">Change Key</button>
  `
})

export class A{
  public emailService: EmailService;
  constructor(emailService: EmailService){
    this.emailService = emailService;
  }

  changeApiKey(){
    this.emailService.apiKey = "XYZ1234";
  }
}

@Component({
  selector: 'component-b',
  template: `
  Component B - {{emailService.apiKey}}
  <button (click)="changeApiKey()">Change Key</button>
  `
})

export class B{
  public emailService: EmailService;
  constructor(emailService: EmailService){
    this.emailService = emailService;
  }

  changeApiKey(){
    this.emailService.apiKey = "ABCD1234";
  }
}

@Component({
  selector: 'app-root',
  template: `

    <component-a></component-a>
    <br />
    <component-b></component-b>
  `,
  providers: [
    EmailService
  ]
})

export class AppComponent {

}

Can someone please explain why most of the examples and tutorials use observable in shared service. What's the advantage in using that ??

在这种情况下，当组件2希望根据组件1的数据更改采取一些措施时，主题和行为主题是有帮助的，反之亦然

---

如果您没有使用任何发布/订阅模式，如Subject或Behavior Subject，则很难观察数据更改并执行操作。

使用它们的原因很少。总的来说，您可以通过以下方式通知组件：

承诺 事件 可观察 让我们简单地看一下所有这些：

您可以使用promise，但它有一个缺点，您只能将事件通知组件一次。一个承诺只解决一次，然后就消失了。比方说，您正在将产品添加到购物车中，您不能使用promise，因为它会发生多次

您可以使用事件，类似于angularJS中的$broadcast和$emit

您拥有observables，这也是一种事件类型，但它还附带了RxJs加载的许多其他特性。您可以使用switchMap、mergeMap等。用简单的话来说，这就像是事件的进化版本

---

看看我的答案，如果你需要更多的澄清，请告诉我