如何使用angular 2在ionic 2框架中返回从http请求中收到的http请求结果。我的代码如下

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class MyService {
  constructor(private http: HttpClient) { }

  getData(): Observable<any> {
    return this.http.get('http://example.com/api/data');
  }
}

import { Component } from '@angular/core';
import { MyService } from './my-service';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  responseData: any;

  constructor(private myService: MyService) { }

  getDataFromServer() {
    this.myService.getData().subscribe(
      response => {
        this.responseData = response;
        console.log(this.responseData);
      },
      error => {
        console.error(error);
      }
    );
  }
}

<ion-content>
  <button ion-button (click)="getDataFromServer()">Get Data</button>
  <div *ngIf="responseData">
    <p>{{ responseData }}</p>
  </div>
</ion-content>