首页 文章

无论父母和孩子如何，在两个组件之间共享数据 - angular2

提问于
浏览 次
2

我一直在使用BehaviorSubject在组件之间共享数据 . 比方说，relative url / article属于ArticleComponent . 然后是ArticlelistComponent中的/ article / list，其中包含一个包含文章详细信息列表的表 . 单击任何行，我需要将行详细信息传递给所有其他组件，并确保将其放置在哪里以便进行变化立即反映 . 请帮忙解决 . 我的代码如下：

articlelist.component.ts

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

article.service.ts

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

article.component.ts

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

编辑：我在Angular2:RxJS Subject not responding to events扩展了我的观察

javascript angular behaviorsubject

2 回答

  • 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/

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

    回复于
  • 0

    它应该像这样工作（这是我一直使用Observables和Subjects的方式） . 我总是试图确保我从主机服务触发并提供订阅，以保持关注点 .

    文章组件

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

    article.service.ts

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

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

    article.component.ts

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

    您是否特别使用行为主题？

    回复于

相关问题