Ionic 2 hhtp undefined

Hi all,

I just try Ionic 2 but have some issues with Http.

The I make a : ionic g provider Product

In the files I just change the path of data.json

import {Injectable} from 'angular2/core';
import {Http, Headers, HTTP_PROVIDERS} from 'angular2/http';

export class Product {
  constructor(http: Http) {
    this.http = http; = null;
    this.dataUrl = 'http://localhost:8080/data.json';

  load() {
    if ( {
      // already loaded data
      return Promise.resolve(;

    // don't have the data yet
    return new Promise(resolve => {
      // We're using Angular Http provider to request the data,
      // then on the response it'll map the JSON data to a parsed JS object.
      // Next we process the data and resolve the promise with the new data.
          .map(res => res.json())
          .subscribe(data => {
          // we've got back the raw data, now generate the core schedule data
          // and save the data for later reference
 = data;


In the app.js the console.debug return : 
Product {http: undefined, data: null, dataUrl: "http://localhost:8080/data.json"}data: nulldataUrl:              http://localhost:8080/data.json"http: undefined__proto__: Product

`import {App, IonicApp, Platform} from 'ionic/ionic';
import {HelloIonicPage} from './pages/hello-ionic/hello-ionic';
import {Product} from './providers/product/product';
import {Http, Headers} from 'angular2/http';
import 'rxjs/add/operator/map';

  templateUrl: 'build/app.html',
  config: {} //
class MyApp {
  constructor(app: IonicApp, platform: Platform) {

    // set up our app = app;
    this.platform = platform;
    // set our app's pages
    this.pages = [
      { title: 'Hello Ionic', component: HelloIonicPage },
      { title: 'My First List', component: HelloIonicPage }

    // make HelloIonicPage the root (or first) page
    this.rootPage = HelloIonicPage;

  initializeApp() {
    this.platform.ready().then(() => {
      // The platform is now ready. Note: if this callback fails to fire, follow
      // the Troubleshooting guide for a number of possible solutions:
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      // First, let's hide the keyboard accessory bar (only works natively) since
      // that's a better default:
      // For example, we might change the StatusBar color. This one below is
      // good for light backgrounds and dark text;
      if (window.StatusBar) {

        var product = new Product();


  openPage(page) {
    // close the menu when clicking a link from the menu'leftMenu').close();
    // navigate to the new page if it is not the current page
    let nav ='nav');

I think you need to define http, data and dataUrl as class member variables.

http : Http;
data : Object;
dataUrl : string;

You can avoid the “http: Http” definition just changing your constructor to
constructor(private http: Http)

This will auto generate the member variable “http”