angular - 数据更改时保持两个值同步

Question

我有两个变量goalsData，goals它们在初始加载时可以正常工作，但我想保持goal同步，goalsData以便如果该变化发生变化，我goalsData将goals如何实现这一点？

ngOnInit() {
    this.goalsData = this.apollo.watchQuery({ query: GoalQuery, forceFetch: true });
    this.goals = this.goalsData.map(({data}) => data.allGoals);

    console.log(this.goals);
  }

Answer 1

我没有使用 Apollo，但是 watchQuery 正在返回一个 Observable。这意味着您必须订阅它才能获得更改。

ngOnInit() {
     this.goalsData = this.apollo.watchQuery({ query: GoalQuery, forceFetch: true });
     this.goalsData
         .map({data}=>data.allGoals)
         .subscribe((goals)=>{
             this.goals = goals;
             console.log(this.goals);
         },(err)=>{
             console.error(err);
         },()=>{
             console.log('finished');
         });
}

假设阿波罗将发出目标数据，这将不断更新this.goals