Hello i am getting an error on my Ionic 3 Angular 4 app. It used to work fine but i did an update on my Windows 10 since then my app doesn’t connect to AuthService. I keep getting an irritating message ‘data is null’ or ‘Unable to get property of userData of undefined or null reference’
authservice.ts
import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';
let apiUrl = "http://localhost/PHP-Slim-Restful2/api/";
@Injectable()
export class AuthService {
constructor(public http: Http) {
console.log('Hello Provider');
}
postData(credentials, type) {
return new Promise((resolve, reject) => {
let headers = new Headers();
console.log(headers);
this.http.post(apiUrl+type, JSON.stringify(credentials), {headers: headers}).
subscribe(res => {
resolve(res.json());
}, (err) => {
reject(err);
});
});
}
}
app.module.ts
import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import {Camera} from '@ionic-native/camera';
import { SplitPane } from '../providers/split-pane';
import { Common } from '../providers/common';
import { HttpModule } from "@angular/http";
import { Welcome } from '../pages/welcome/welcome';
import { Login } from '../pages/login/login';
import { Signup } from '../pages/signup/signup';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import { UploadPage } from '../pages/upload/upload';
import { SearchPage } from '../pages/search/search';
import { UserPage } from '../pages/userProfile/userProfile';
import { MediaPage } from '../pages/mediaProfile/mediaProfile';
import { SettingsPage } from '../pages/settings/settings';
import { AccountPage } from '../pages/account/account';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { MomentModule } from 'angular2-moment';
import { LinkyModule } from 'angular-linky';
import { AuthService} from '../providers/auth-service';
@NgModule({
declarations: [
MyApp,
Welcome,
Login,
Signup,
AboutPage,
ContactPage,
HomePage,
TabsPage,
UploadPage,
SearchPage,
SettingsPage,
AccountPage,
UserPage,
MediaPage
],
imports: [
BrowserModule,HttpModule,MomentModule,LinkyModule,
IonicModule.forRoot(MyApp), BrowserAnimationsModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
Welcome,
Login,
Signup,
AboutPage,
ContactPage,
HomePage,
TabsPage,
UploadPage,
SearchPage,
SettingsPage,
AccountPage,
UserPage,
MediaPage
],
providers: [
StatusBar,
SplashScreen,Camera,AuthService,SplitPane,Common,
{provide: ErrorHandler, useClass: IonicErrorHandler},
AuthService
]
})
export class AppModule {}
This is the first page
welcome.ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Login } from '../login/login';
import { Signup } from '../signup/signup';
import { TabsPage } from '../tabs/tabs';
import { AuthService } from "../../providers/auth-service";
/**
* Generated class for the Welcome page.
*
* See http://ionicframework.com/docs/components/#navigation for more info
* on Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-welcome',
templateUrl: 'welcome.html',
})
export class Welcome {
constructor(public navCtrl: NavController, public authService: AuthService, public navParams: NavParams) {
if(localStorage.getItem('userData')){
this.navCtrl.setRoot(TabsPage);
}
}
ionViewDidLoad() {
console.log('ionViewDidLoad Welcome');
}
login(){
this.navCtrl.push(Login);
}
signup(){
this.navCtrl.push(Signup, {}, {animate:false});
}
}
Any help?