2

我一直在使用 BehaviorSubject 在组件之间共享数据。比如说，相对 url /article 属于 ArticleComponent。然后是 ArticlelistComponent 中的 /article/list，其中包含一个包含文章详细信息列表的表格。单击任何行时，我需要将该行详细信息传递给所有其他组件，这就是我的议程。我面临的问题是，ngOnInit 仅适用于页面重新加载。最初，只有默认 {} 反映在文章组件中，这不过是我为 BehaviorSubject 设置的默认结果。当我单击表中的一行时，该数据不会在 ngOnInit 中自动更新和订阅。旧值 {} 被保留在整个过程中。我不确定将其放置在何处以使更改立即反映出来。请帮忙解决。我的代码如下：

articlelist.component.ts

getSpecificDetail(value){
        this.articleService.getArticleDetail(value);
   }

文章.service.ts

 public articledata=new BehaviorSubject<Object>({});
    currentdata=this.articledata.asObservable();
  getArticleDetail(data){         //data comes from articlelist.component
          return this.articledata.next(data);
    }

文章.component.ts

 ngOnInit(){
    this.articleService.currentdata.subscribe(data=>{
    this.data=data;
    console.log(this.data);
    })
   }

编辑：我在Angular2:RxJS 主题中扩展了我的观察，没有响应事件

4

2 回答 2

1

它应该像这样工作（这就是我一直使用 Observables 和 Subjects 的方式）。我总是尝试确保我正在触发并提供来自主机服务的订阅，以保持关注点分开。

文章组件 

  getSpecificDetail(value){
       this.articleService.setData(value);
  }

文章.service.ts

  articledata=new BehaviorSubject<Object>({});

  getData() : Observable<Object> {
     return this.articleData.asObservable();
  }
  setData(data) : void { this.articleData.next(data); }

文章.component.ts

 ngOnInit(){
    this.patientService.getData().subscribe( data =>{
        this.data=data;
         console.log(this.data);
     })
 }

您专门使用行为主题的任何原因？

于 2017-08-23T18:18:02.417 回答
1

根据您对这些数据所做的工作，在绑定到该数据的组件之间共享数据的另一种方法是利用 Angular 的变更检测而不是使用您自己的BehaviorSubject.

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

@Injectable() 
export class DataService {
  serviceData: string; 
}

我在这里有一篇关于它的博客文章：https ://blogs.msmvps.com/deborahk/build-a-simple-angular-service-to-share-data/

还有一个plunker：https ://plnkr.co/edit/KT4JLmpcwGBM2xdZQeI9?p=preview

于 2017-08-23T18:06:50.550 回答