javascript - 在以角度 4 渲染函数后从服务共享数据到组件

Question

我有服务，在服务中，我有一个设置图表数组的“cohortTabsResult”方法。我想在“chart.component”中使用这个数组

export class CohortService {
 public charts: Array<any>;

 cohortTabsResult(obj){
    this.charts = []
    const subscription = this.cohortDataReq(obj).subscribe(res => {
        if(res.status !== 500){

            const dataObj = {
                definedChart: obj.graph_type,
                definedChartData: []     
            };
            this.charts.push(dataObj);
            const response = res.json() 
            //console.log(response)

            if (response.error) {
                //this.isLoaded = false;                              
            } 
            else{
                 Array.prototype.forEach.call(response.data, dataRes => {
                    const newData = this.getChartDataFormat(dataRes, obj.graph_type, "userType")
                    dataObj.definedChartData = _.cloneDeep(newData);
                  });

            } 

        }

    });

}

}

这是我的chart.component 这里我得到的是空数组。

export class ChartCohortComponent implements OnInit{
  charts: any;
  constructor(private cohortService: CohortService, private route: 
  Router, public activatedRoute: ActivatedRoute) {
       this.charts = this.cohortService.charts;
  }


  ngOnInit(){ 

    console.log("ch", this.charts)

  }
 }

标签： javascriptangular

Answer 1

将 CohortService 导入您的组件，将其添加到 @component 中的提供程序，现在您可以访问服务内的变量。:D

import { CohortService } from '../../cohort.services'; // whatever the path is.. 
@Component({
  selector: '',
  templateUrl: '',
  styleUrls: [''],
  providers: [CohortService]
})
export class ChartCohortComponent implements OnInit{
  charts: any;
  constructor(private cohortService: CohortService, private route: 
  Router, public activatedRoute: ActivatedRoute) {
       this.charts = this.cohortService.charts;
  }


  ngOnInit(){ 

    console.log("ch", this.charts)

  }
 }