Question

我在使用NgOnInit函数从服务器获取数据时遇到问题。有了这些数据，我想用morris.js绘制一个情节，但我没有得到那些数据。

我有一项服务可以从DB获得所有汽车赔偿，然后我想绘制每日补偿总额的情节。我得到了无效的赔偿，我不能画任何东西。

我的代码：

constructor(_router: Router, public http: Http, private _reparacionsService: ReparacioService) {
    this.router = _router;
}

getReparacions() {
    this._reparacionsService.getReparacions().subscribe(rep => this.reparacions = rep.json());
}

ngOnInit() {
    this.getReparacions();
    this.getLastWeek();
    this.getReparacionsDia();
    window['Morris'].Line({
        element: 'repDaychart',
        data: this.reparacionsDies,
        xkey: 'data',
        ykeys: ['totalReparacions'],
        labels: ['totalReparacions'],
        parseTime: false,
        xLabels: "day"
    });
}

我已经导入并声明了OnInit：

 import {Component, OnInit} from 'angular2/core';
  export class DashBoard implements OnInit

我正在使用角度测试版17。感谢。

Answer 1

此代码为异步

this._reparacionsService.getReparacions().subscribe(rep => this.reparacions = rep.json());

这意味着

中的this.getLastWeek();

ngOnInit() {
    this.getReparacions();
    this.getLastWeek();

在执行this.reparacions = rep.json()之前执行

您可能想要做类似

的事情

getReparacions() {
    return this._reparacionsService.getReparacions().map(rep => this.reparacions = rep.json());
}

ngOnInit() {
  this.getReparacions().subscribe(data => {
    this.getLastWeek();
    this.getReparacionsDia();
    window['Morris'].Line({
        element: 'repDaychart',
        data: this.reparacionsDies,
        xkey: 'data',
        ykeys: ['totalReparacions'],
        labels: ['totalReparacions'],
        parseTime: false,
        xLabels: "day"
    });
  });
}

只有在其他调用（getLastWeek()，getReparacionsDia（）`）异步时才有效。

Angular2 OnInit，没有从服务器获取数据

1 个答案: