帶有主題的角度服務Observable調用next（）不被組件訂閱看到

我想從角度服務中檢索更新的對象值（借用者）。我在服務中創建了一個RxJS Subject，以便多個組件可以訂閱它並獲取更新的值。帶有主題的角度服務Observable調用next（）不被組件訂閱看到

當我通過組件中提供的服務訂閱主題時，我發現即使從BorrowerService調用.next()也不會調用onNext()函數參數。

如果我在BorrowerService類中訂閱了，我發現.next()按預期工作。看起來，Subject是調用.next()的Service類與組件之間的不同實例，因此不會獲得該訂閱。

這是不是在理解角服務或觀測？如何更新服務中的值，並在不知道何時調用.next()的情況下被動獲取組件中的更改？

借款人，report.component.ts

@Component({ 
    ... 
    providers: [BorrowerService] 
}) 
export class BorrowerReport { 
    private borrower: Borrower; 

    constructor(private borrowerService: BorrowerService) { 
     this.borrowerService.borrowerChanged.subscribe(borrower => {this.borrower = borrower}); 
    } 
}

borrower.service.ts

@Injectable() 
export class BorrowerService { 
    public borrowerChanged: Subject<Borrower> = new Subject<Borrower>(); 

    //event handler 
    selectBorrower(borrower: Borrower) { 
     this.borrowerChanged.next(borrower); 
    } 
}

來源

2017-10-06 MattTreichelYeah

https://stackoverflow.com/q/42567674/5394220 dup –

問題是您的服務的範圍，並且@ngModule不提供該服務。如果你希望這是一個單例服務（多個組件的服務實例相同），那麼你會希望在包含所有子組件的父模塊中提供服務。對於有保證的路線，請將此添加到您的app.module.ts。將其導入到模塊中，並將其作爲服務提供，就像您在組件中所做的那樣（將其作爲組件中的提供者移除，但是...您只希望父模塊提供它）。

然後，您可以像現有一樣將服務導入組件，並且provider將作爲父模塊。基本思想是父模塊將爲所有子組件提供服務，因此所有子組件都將接收相同的服務實例（因此具有相同的值）。

便箋：This SO Answer提供了創建單件服務電話ApiService的詳細信息，應作爲堅實的指導。另一個最佳答案也提供了一個堅實的解釋。

第二個注意事項：如果您希望從您的主題推送更新，您也需要使用BehaviorSubject。對BehaviorSubject的訂閱將自動更新，而對主題的訂閱必須手動調用。

來源

2017-10-06 19:57:10

考慮以下幾點：

borrower.service.ts

import {Injectable} from '@angular/core'; 
import {BehaviorSubject} from 'rxjs/BehaviorSubject'; 


@Injectable() 
export class BorrowerService { 

    public borrowerChanged = new BehaviorSubject<string>('Defaut Value'); 
    borrowerChangedObservable = this.borrowerChanged.asObservable(); 
    constructor(){} 

    changeValue(value: string): void { 
    this.borrowerChanged.next(value); 
    } 
}

，然後在您的組件：

借款人，report.component.ts

，讓你做的值：

constructor(private borrowerService: BorrowerService) { 
    this.borrowerService.borrowerChangedObservable 
     .subscribe((borrower) => { 
       console.log(borrower); 
      }); 
    }

設置你做一個新的價值：

sendNewValueToBorrowerService(){ 
this.borrowerService.changeValue('my new value'); 
}

，不要忘記在提供的數組中添加該服務，並在同一模塊的聲明數組中添加該組件。

來源

2017-10-06 19:54:26

帶有主題的角度服務Observable調用next（）不被組件訂閱看到

回答

相關問題