Highcharts angular 2和observables http请求

我正在尝试创建一个图表，使用http请求提交的可观测数据，以下代码正在使用一些虚假数据，我只想用后端脚本提交的真实数据替换它们以下是我的代码：

我的app.ts：

export class MyVerticalchartComponent  {


   @Input() showMePartially: boolean;

  options: Object;

  constructor(public userService3: UserService3) {

       this.options = {
        title : { text : '' },
        chart: {  type: 'area' },
        legend: { enabled: false },
        credits: { enabled: false },
        xAxis: { type: 'datetime',
              //    startOnTick: true,
              //    endOnTick: true,
              //    tickInterval: 24 * 3600 * 1000,
            },
                  dateTimeLabelFormats: {
            second: '%H:%M:%S',
            minute: '%H:%M:%S',
            hour: '%H:%M:%S',
            day: '%H:%M:%S',
            week: '%H:%M:%S',
            month: '%H:%M:%S',
            year: '%H:%M:%S'
        },
        yAxis: { min: 0,
          max: 100 },
        plotOptions: {
          series: {
          //  pointStart: 0,
              color: '#648e59',
              fillOpacity: 0.8,
              fillColor: '#648e59'
                  }
        },
        series: [{
          name: 'Someone1',
          **data: [ // here should come my Observable !!
        [1497837618,0],[1497837738,0],[1497837858,0],[1497837978,0],[1497838098,0],[1497838218,0],[1497838338,0],[1497838458,0]    ],**
        }]
    };
}

}

my app.html：

 <chart [options]="options">
      <series>
     </series>
  </chart>

@可注射（） 导出类UserService3{

用户3：可观察

constructor (public http: Http) {

          const tick3$ = Observable.timer(100, 60000);

      this.users3 = tick3$.flatMap(() => http.get(usersURL)).map(res => [res.json()]).publishBehavior(<User3[]>[]).refCount();

}
}

---

我建议您将观察者移动到单独的方法中

getData() {
     const tick3$ = Observable.timer(100, 60000);

     return tick3$.flatMap(() => this.http.get(usersURL)).map(res => [res.json()]).publishBehavior(<User3[]>[]).refCount();

}

---

编辑

我建议您将观察者移动到单独的方法中

getData() {
     const tick3$ = Observable.timer(100, 60000);

     return tick3$.flatMap(() => this.http.get(usersURL)).map(res => [res.json()]).publishBehavior(<User3[]>[]).refCount();

}

---

编辑

非常感谢您的快速回复…听起来不错，我现在正在尝试！对于方法getData（），我应该在构造函数中使用它吗？因为它会生成错误..如果我将该方法放在mmy构造函数之外，我的vs代码会说：[ts]找不到名称“http”。类型“{}”上不存在任何（第一个错误）和[ts]属性“json”“.任何（第二）秒，我想这是因为我的http被注入我的构造函数中…如果你问，你应该把它放在哪里…它应该在构造函数之外的你的服务中（在它旁边）…我编辑了我的答案非常感谢你的快速回答…听起来不错，我正在尝试！对于方法getData（）我应该在我的构造函数中使用它吗？因为它会生成错误..如果我将该方法放在mmy构造函数之外，我的vs代码会说：[ts]找不到名称“http”。类型“{}”上不存在任何（第一个错误）和[ts]属性“json”。任何（第二个）我想这是因为我的http被注入我的构造函数中…如果你问，你应该把它放在哪里…它应该在构造函数之外的服务中（在它旁边）…我已经编辑了我的答案

getData() {
     const tick3$ = Observable.timer(100, 60000);

     return tick3$.flatMap(() => this.http.get(usersURL)).map(res => [res.json()]).publishBehavior(<User3[]>[]).refCount();

}

public ngOnInit () {
   this.userService3.getData().subscribe((data) => {
     console.log(this.options); // to see the strcture
     console.log(data); // to see the response

     this.options.series[0].data = data;
   });
}