Question

componentA具有可观察到的myService getData的订户。 componentB有按钮。我希望在按下此按钮后会出现以下操作：

myService将调用服务器并获取数据；
componentA的订户将处理此数据。

我尝试了以下代码：

（myService）

getData(): Observable<IData> {
    return this.http.get<IData>(apiUrl);
}

（componentA）

ngOnInit() {
    this.myService.getData().subscribe(response => console.log(response));
}

（componentB）

public onClick(): void {
    this.myService.getData();
}

当我按下ComponentB中的按钮时，ComponentA中的订户不执行任何操作。在ComponentB中按下按钮后如何激活ComponentA中的订户？

Answer 1

您尚未定义两个组件A＆B的关系。而且我认为您想在B中单击按钮时在A中订阅服务。如果B是A的子项，则可以在子项中使用EventEmitter在按钮单击时发出事件，在父项中处理该事件，然后在该处理程序中进行订阅，但是那么您将无法在A的ngOnInit生命周期挂钩中进行订阅（您只能在处理程序中进行订阅）。 A：模板

<app-bcomponent (dataEmmiter)="handler($event)"><app-bcomponent>

A：Ts：

handler(e){
 this.myService.getData().subscribe(response => console.log(response));}

B：Ts

@Output
dataEmmiter: EventEmitter<any> = new EventEmitter<any>();

    getData(): Observable<IData> {
this.dataEmmiter.emit(anydata);
    return this.http.get<IData>(apiUrl).subscribe(data=>{
//Do what u want
});
}

Answer 2

问题是您正在onClick（comp B）处理程序中创建一个新的可观察实例，而该实例与ngOnInit（Comp A）中创建的实例无关。

在您的服务中执行以下操作：

public data$: Observable<IData>;

    constructor() {
        this.data$ = this.http.get<IData>(apiUrl).pipe(
           shareReplay(1)
        );
    }

在组件B中：

public onClick(): void {
    this.myService.data$.subscribe(
// Any code to execute when data is received
);
}

然后，无论您要访问访问的数据在何处，都可以使用myService.data $。 shareReplay运算符将确保无论数据$预订了多少次，http提取操作都只会执行一次。

Answer 3

您可以在服务中设置发射器，并在按组件B中的按钮时发射数据，并使用组件a中的订户从服务中订阅数据；

是这样的：

  public static int divide(int a, int b) {

        try{
           int result = a / b;
            return result;
        } 
       catch (ArithmeticException ae) {
            System.out.println("Error! Divided by zero!");
            return 0;
       }
    }

组件a

 public dataEmmiter: EventEmitter<any> = new EventEmitter<any>();

    getData(): Observable<IData> {
    return this.http.get<IData>(apiUrl).subscribe(data=>{
this.dataEmmiter.emit(data);
});
}

如何从另一个角度组件激活一个组件中的rxjs订户？

3 个答案: