hi,
I’m using Ionic2 and try a lot of tutorials without success.
I have a register page
<form (submit)="register()">
<ion-list>
<ion-item>
<ion-label fixed>EMAIL</ion-label>
<ion-input type="email" [(ngModel)]="user.email" name="email"></ion-input>
</ion-item>
<ion-item>
<ion-label fixed>PASSWORD</ion-label>
<ion-input type="password" [(ngModel)]="user.password" name="password"></ion-input>
</ion-item>
<ion-item>
<ion-label fixed>STREET</ion-label>
<ion-input type="text" [(ngModel)]="user.street" name="street"></ion-input>
</ion-item>
<ion-item>
<ion-label fixed>ZIPCODE</ion-label>
<ion-input type="text" [(ngModel)]="user.zipcode" name="zipcode"></ion-input>
</ion-item>
<ion-item>
<ion-label fixed>PHONE</ion-label>
<ion-input type="text" [(ngModel)]="user.phone" name="phone"></ion-input>
</ion-item>
<ion-item>
<ion-label fixed>MOBILE</ion-label>
<ion-input type="text" [(ngModel)]="user.mobile" name="mobile"></ion-input>
</ion-item>
<div padding>
<button ion-button color="primary" block>Register</button>
</div>
</ion-list>
</form>
Here is my provider:
import { Injectable } from ‘@angular/core’;
import { Http } from ‘@angular/http’;
import ‘rxjs/add/operator/map’;
/*
Generated class for the User provider.
See https://angular.io/guide/dependency-injection for more info on providers
and Angular DI.
*/
@Injectable()
export class UserProvider {
useritem: any;
constructor(public http: Http) {
console.log(‘Hello User Provider’);
}
getUserByID(id: string) {
this.useritem = null;
var url = "http://resteasyshop.be/userrestservice.svc/GetUser/" + id;
var response = this.http.get(url);// = this.http.get(url).map(res => res.json());
//this.http.get(url).subscribe(data => {
// response = data.json();
//},
// error => {
// response = error.json();
// });
console.log("response:" + response);
}
}
I registred it in app.module.ts
In my page i imported it too: import { UserProvider } from ‘…/…/Providers/User/User’;
In the constructor when i want to pass an object of UserProvider
constructor(public navCtrl: NavController, public navParams: NavParams, public userProvider: UserProvider ) {
console.log('loadRegister');
//this.user = this.userProvider.getUserByID("0");// this.navParams.get('user');
//console.log("test:"+this.user);
}
I get back this error:
Error: Encountered undefined provider! Usually this means you have a circular dependencies (might be caused by using ‘barrel’ index.ts files.
at syntaxError (http://localhost:8100/build/vendor.js:75153:34)
at http://localhost:8100/build/vendor.js:90292:40
at Array.forEach ()
at CompileMetadataResolver._getProvidersMetadata (http://localhost:8100/build/vendor.js:90277:19)
at CompileMetadataResolver.getNgModuleMetadata (http://localhost:8100/build/vendor.js:89847:50)
at JitCompiler._loadModules (http://localhost:8100/build/vendor.js:108171:87)
at JitCompiler._compileModuleAndComponents (http://localhost:8100/build/vendor.js:108132:36)
at JitCompiler.compileModuleAsync (http://localhost:8100/build/vendor.js:108048:37)
at CompilerImpl.compileModuleAsync (http://localhost:8100/build/vendor.js:73989:49)
at PlatformRef.bootstrapModule (http://localhost:8100/build/vendor.js:5796:25)
In all tutorials it seems really easy but i guess i did a mistake