4

Angular Service から更新されたオブジェクト値 (借り手) を取得したいと考えています。Subject複数のコンポーネントがそれにサブスクライブして更新された値を取得できるように、Service にRxJS を作成しました。

コンポーネントで提供されたサービスを介してサブジェクトにサブスクライブすると、onNext()関数の引数が.next()BorrowerService から呼び出されても呼び出されないことがわかりました。

BorrowerService クラス内でサブスクライブした場合.next()、期待どおりに機能することがわかりました。Subject は、呼び出す Service クラスと.next()コンポーネントの間で別のインスタンスであるため、そのサブスクリプションを取得していないようです。

これは Angular Services または Observables の理解に失敗していますか? サービスの値を更新し、いつ呼び出すかを知らずにコンポーネントの変更を受動的に取得するにはどうすればよい.next()ですか?

借り手レポート.component.ts

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

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

借り手.サービス.ts

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

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

2 に答える 2

2

次のことを考慮してください。

借り手.サービス.ts

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


@Injectable()
export class BorrowerService {

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

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

そして、あなたのコンポーネントで:

借り手レポート.component.ts

あなたが行う値を取得するには:

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

新しい値を設定するには:

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

また、同じモジュールの provides 配列にサービスを追加し、declarations 配列にコンポーネントを追加することを忘れないでください。

于 2017-10-06T19:54:26.650 に答える