Comment créer un objet de comportement pour un objet et s'y abonner sur un autre composant?

Question

J'ai créé un objet de comportement dans une classe de service.

public personObject: BehaviorSubject<any> = new BehaviorSubject<any>({ 
               personId: 1, 
               name: 'john doe' 
               }); 

Sur un composant qui importe ce service, j'ai souscrit ce sujet du comportement comme celui-ci:

`  this._subscription.add(
      this._bankService.personObject.subscribe(data => { 
       this.personObject = data; 
       console.log(data); 
      }) 
     );` 

Mais je ne suis pas en mesure d'obtenir des données précises définies dans le sujet du comportement. S'il vous plaît aider.

Modifier J'ai oublié de mentionner que j'ai utilisé ViewContainerRef pour créer mon composant frère. J'ai donc ajouté une réponse avec quelques commentaires sur mon problème.

Answer 1

J'ai oublié de mentionner que j'utilisais j'utilisais ViewContainerRef pour créer un composant frère et il s'avère que le sujet de comportement ne fonctionne pas de la même manière avec le composant créé usi Voir ViewContainerRef.

D'autres sujets de comportement sages d'un objet fonctionnent exactement comme avec un nombre ou une chaîne. J'ai utilisé @Input pour envoyer des données au composant pour le moment.

Answer 2

Service

@Injectable() 
export class DataService { 

    private _dataListSource: BehaviorSubject<IData[]> = new BehaviorSubject([]); 
    dataList: Observable<IData[]> = this._dataListSource.asObservable().distinctUntilChanged(); 

    ... 

    getDataList(): Observable<any> { 
     return this.httpService.get('/data').map(res => { 
      this._dataListSource.next(res); 
     }); 
    } 

et vous pouvez l'utiliser dans votre composant

export class DataComponent implements OnInit { 

    public dataList$: Observable<IData[]>; 

    constructor(public dataService: DataService) {} 

    ngOnInit() { 
     this.dataList$ = this.dataService.dataList; 
     this.dataService.getDataList().subscribe(); 
    } 
} 

et votre code html

<div *ngIf="dataList$ | async; let dataList; "> 
     <div *ngFor="let data of dataList"> 
      {{ data | json}} 
     </div> 
    </div>