I have a api for fetching data in ion list , but not working, i need help.
accounts.ts
import { Component, OnInit } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AccountService } from '../../providers/account-service';
import { Headers, Jsonp, Http, RequestOptions} from '@angular/http';
import 'rxjs/add/operator/map';
@Component({
selector: 'page-account',
templateUrl: 'account.html'
// ,
//template: '<ion-item text-wrap *ngFor="let c of data ">{{data.gender}}</ion-item>'
})
export class AccountPage implements OnInit{
data: any;
cell: any;
arr: any;
celular: any;
constructor(public navCtrl: NavController, public navParams: NavParams, public AccountService: AccountService,
private jsonp: Jsonp, private http: Http) {
//let headers = new Headers();
//headers.append('x-access-key', this.token);
//let options = new RequestOptions({
// headers: headers
//});
//this.jsonp.get(this.url, options).map((res: Response) => this.data);
//console.log(this.data);
}
ngOnInit() {
//this.data = this.AccountService.getAccounts();
let headers = new Headers();
headers.append('x-access-key', '6b157c1ef92e7dee1ad4779a2dff8958');
headers.append('Content-type', 'application/json')
let options = new RequestOptions({
headers: headers
});
return this.http.get('http://debora.testmylimsweb.com/api/v2/accounts?callback=JSONP_CALLBACK', options)
.map(res => res.json())
.subscribe(data => this.data = data.results,
err => console.log("erro", err),
() =>
this.data
);
}
ionViewDidLoad() {
//this.data = this.AccountService.getAccounts();
}
// for button test
test() {
let headers = new Headers();
headers.append('x-access-key', '6b157c1ef92e7dee1ad4779a2dff8958');
headers.append('content-type', 'application/json')
let options = new RequestOptions({
headers: headers
});
return this.http.get('http://debora.testmylimsweb.com/api/v2/accounts?callback=JSONP_CALLBACK', options)
.map(res => res.json())
.subscribe(data => this.data = data,
err => console.log("erro", err),
() =>
console.log(this.data)
);
}
}
**account-service.ts -- provider**
import { Injectable } from '@angular/core';
import { Headers, Jsonp, Http, RequestOptions} from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class AccountService {
/**
* Variaveis globais
**/
token: string = '43c3f75fc7619ca2432a039dcaeae836';
//url: string = 'http://v1_37_fixes.testmylimsweb.com/api/v2/accounts?callback=JSONP_CALLBACK';
url: string = 'https://randomuser.me/api?callback=JSONP_CALLBACK';
data: Object;
constructor(private jsonp: Jsonp, private http: Http) {
}
getAccounts() {
let headers = new Headers();
headers.append('x-access-key', this.token);
headers.append('Content-type', 'application/json')
let options = new RequestOptions({
headers: headers
});
return this.jsonp.get(this.url)
.map(res => res.json())
.subscribe(data => this.data = data.results[0],
err => console.log("erro", err),
() =>
// console.log(this.data)
this.data
);
}
getAccountsDebug() {
console.log(this.getAccounts());
}
}
account.html
<script src="accounts.js"></script>
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Contas</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding><button (click)="test();">aaaaaaaaaaaaaaaaa</button>
<ion-list id="list-accounts" *ngIf="data">
<!--<ion-item text-wrap *ngFor="let c of data | async">-->
<ion-item text-wrap *ngFor="let c of data">
{{data | json }}
</ion-item>
</ion-list>
</ion-content>
return this, when click in button, return in response my json, but no fetching in view
