我一直在环顾四周如何让我的代码等待http请求继续前进,我需要它的原因是因为我使用响应来填充html中的一些变量。Ionic 2等待http响应
所以,
问题1:我真的需要创建一个服务,使HTTP请求,并返回一个无极/可观察?
问题2:这是我的代码,我不能在这里做点什么来让代码等待响应吗?
let link = 'http://working url';
let headers = new Headers({
'Content-Type': 'application/x-www-form-urlencoded',
'Accept': '*/*'
});
let options = new RequestOptions({headers: headers});
this.http
.post(link, this.loginString, options)
.map(res => res.json())
.subscribe(
data => {
let response = JSON.parse(data);
if(response.Successfull){
if(response.ReturnObject.length>0){
this.orders = this.orderJson(response.ReturnObject);
this.ordersWithoutGroup = response.ReturnObject;
this.empty = false;
}else{
this.orders= [];
this.empty= true;
}
}
}, err => {
this.showAlertError();
},() => {
this.loadingPopup.dismiss()
});
}
非常感谢您的帮助。
编辑1: HTML:
<ion-content class="stable-bg" scroll="true">
<div class="item-input-inset">
<label class="item-input-wrapper">
<i class="icon ion-ios-search placeholder-icon"></i>
<input type="text" placeholder="Search Orders" ng-model="search">
</label>
</div>
<ion-list *ngIf="orders !== null" ng-repeat="(date, group) in orders">
<ion-item class="item-divider">{{ date }}</ion-item>
<ion-item class="item-icon-left item-icon-right" ng-repeat="order in group" (click)="goToDetail(order.ID)">
<div ng-show="order.DocumentNumber.indexOf(search) >-1 || !search ">
<i class="icon ion-card"></i>
<div>Nº {{ order.DocumentNumber }}
<span class="gray pull-right">{{ order.time }}</span>
</div>
<i class="icon ion-ios-arrow-right"></i>
</div>
</ion-item>
</ion-list>
<div ng-show="empty">
<div class="card">
<div class="item item-text-wrap ion-information-circled" (click)="check()">At the moment there isn't any order to
approve.</div>
</div>
</div>
</ion-content>
有关的.ts更多代码:
import { Component , OnInit, Injectable} from '@angular/core';
import { NavController, AlertController, LoadingController } from 'ionic-angular';
import { Http, Headers, RequestOptions} from '@angular/http';
import * as moment from 'moment';
@Injectable()
@Component({
selector: 'page-orders',
templateUrl: 'orders.html'
})
export class OrdersPage implements OnInit{
orders: any;
loginString: any;
empty: boolean;
ordersWithoutGroup: any;
loadingPopup: any;;
constructor(public navCtrl: NavController,private alertController: AlertController, private http: Http, private loadingCtrl: LoadingController) {
this.loadingPopup = this.loadingCtrl.create({
content: 'Loading orders...'
});
// Show the popup
this.loadingPopup.present();
this.orders= {}
this.loginString = localStorage.getItem("Auth");
}
ngOnInit() {
this.getOrders();
}
出于某种原因,如果我用ngIf它不工作对我来说这不是门坎自动加载UI ...... –
编辑与问题都' .html'和'.ts'代码。这不应该有任何理由不起作用。 –
对不起,已经更新。 –