title: Property 'http' does not exist on type 'MyproviderProvider'
body: <p>I know this question has been asked on this platform but I couldn't pin point a solution to my problem. I am creating a login page for an app which gets user's login details from mysql database using http. On my <strong>MyproviderProvider</strong> I am getting <strong>Property 'http' does not exist on type 'MyproviderProvider'.</strong>. I have imported all the modules needed for it even made the http private but it still does not change anything.</p>
  
  <p>Below is my codes:</p>
  
  <p><strong>Login.html</strong></p>
  
  <pre><code>&lt;ion-content class="login-content" padding&gt;
    &lt;ion-row class="logo-row"&gt;
      &lt;ion-col&gt;&lt;/ion-col&gt;
      &lt;ion-col &gt;
        &lt;img src="../assets/imgs/logo.png" class="img-responsive " id="img2"&gt;
      &lt;/ion-col&gt;
      &lt;ion-col&gt;&lt;/ion-col&gt;
    &lt;/ion-row&gt;
    &lt;div class="login-box"&gt;
      &lt;form (ngSubmit)="login()" #registerForm="ngForm"&gt;
        &lt;ion-row&gt;
          &lt;ion-col&gt;
            &lt;ion-list inset&gt;
  
              &lt;ion-item&gt;
                &lt;ion-input type="text" placeholder="Email" name="email" [(ngModel)]="registerCredentials.email" required&gt;&lt;/ion-input&gt;
              &lt;/ion-item&gt;
  
              &lt;ion-item&gt;
                &lt;ion-input type="password" placeholder="Password" name="password" [(ngModel)]="registerCredentials.password" required&gt;&lt;/ion-input&gt;
              &lt;/ion-item&gt;
  
            &lt;/ion-list&gt;
          &lt;/ion-col&gt;
        &lt;/ion-row&gt;
  
        &lt;ion-row&gt;
          &lt;ion-col class="signup-col"&gt;
            &lt;div align="center"&gt;
            &lt;button ion-button class="submit-btn" full type="submit" [disabled]="!registerForm.form.valid"&gt;Login&lt;/button&gt;
            &lt;span class="tell"&gt;- or -&lt;/span&gt;
            &lt;button ion-button class="register-btn" type="button" block clear (click)="createAccount()"&gt;Create New Account&lt;/button&gt;
          &lt;/div&gt;
          &lt;/ion-col&gt;
        &lt;/ion-row&gt;
  
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p><strong>MyproviderProvider(Providers)</strong></p>
  
  <pre><code>import { HttpClient } from '@angular/common/http';
  import { Http } from '@angular/http';
  import { Storage } from '@ionic/storage';
  import { Injectable } from '@angular/core';
  import {Observable} from 'rxjs/Observable';
  import 'rxjs/add/operator/map';
  
  
  export class User {
    name: string;
    email: string;
  
    constructor(private http: Http) {
  
    }
  
  }
  
  @Injectable()
  export class MyproviderProvider {
  
  
    currentUser: User;
  
    public login(credentials) {
      if (credentials.email === null || credentials.password === null) {
        return Observable.throw("Please insert Login Details");
      } else {
        return Observable.create(observer =&gt; {
          this.http.post('your url?email'+credentials.email+'&amp;password='+credentials.password)
          .map(res =&gt; res.json())
          .subscribe(data =&gt;
          {        
          console.log(data)//you can format the response from your server
          observer.next(data );//and then return data
          observer.complete();
          });
          });
      }
    }
  
    public register(credentials) {
      if (credentials.email === null || credentials.password === null) {
        return Observable.throw("Please insert credentials");
      } else {
        // At this point store the credentials to your backend!
        return Observable.create(observer =&gt; {
          observer.next(true);
          observer.complete();
        });
      }
    }
  
    public getUserInfo() : User {
      return this.currentUser;
    }
  
    public logout() {
      return Observable.create(observer =&gt; {
        this.currentUser = null;
        observer.next(true);
        observer.complete();
      });
    }
  
  }
  </code></pre>
  
  <p><strong>app.module</strong></p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { ErrorHandler, NgModule } from '@angular/core';
  import { HttpModule } from '@angular/http';
  import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
  import { SplashScreen } from '@ionic-native/splash-screen';
  import { StatusBar } from '@ionic-native/status-bar';
  
  
  import { MyApp } from './app.component';
  
  import { MyproviderProvider } from '../providers/myprovider/myprovider';
  
  import { IonicStorageModule } from '@ionic/storage';
  
  @NgModule({
    declarations: [
      MyApp
    ],
    imports: [
      BrowserModule,
      HttpModule,
      IonicModule.forRoot(MyApp),
      IonicStorageModule.forRoot()
    ],
    bootstrap: [IonicApp],
    entryComponents: [
      MyApp
    ],
    providers: [
      StatusBar,
      SplashScreen,
      {provide: ErrorHandler, useClass: IonicErrorHandler},
      MyproviderProvider
    ]
  })
  export class AppModule {}
  </code></pre>