访问promise回调中的全局变量(在Angular中)

Question

我正在开发一款应用程序，该应用程序应在数据发送到API之前检查在线状态。根据状态，它还应该路由到不同的位置。在XHR之前，一些数据是从本地存储器中使用的。我可以在回调中传递和记录状态，但这个.router.navigation((和这个.storage.remove((将不起作用。

我也尝试过ngZone进行路由，但失败了(未定义(。接下来我会尝试一个.bind((，但我的头有点被atm阻塞了。

如果能告诉我(下一步(可以尝试什么，我将不胜感激。

这是调用服务的组件：

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router'
import { SaveData } from '../saveData.service'
import { Storage } from '@ionic/storage'
@Component({
selector: 'app-save',
templateUrl: './save.page.html',
styleUrls: ['./save.page.scss'],
})
export class SavePage {
constructor(private saveData: SaveData) { }
async ionViewDidEnter() { 
this.saveData.do('url/to/api.php', this.saveData.mycallback);
}
}

以及服务

import {Injectable} from '@angular/core';
import {Router} from '@angular/router';
import {Storage} from '@ionic/storage';
@Injectable({
providedIn: 'root',
})
export class SaveData {
constructor(
private getData: GetData,
private router: Router,
private storage: Storage
) {}

async mycallback(connection) {
console.log("from callback:", connection)

if (connection === 'ok') {
await this.storage.remove('Orders')
this.router.navigate(['somewhere']);
} else {
this.router.navigate(['somewhere_else']);
}

do = async (fetchURL, callback) {
var requestURL = (await this.storage.get('server')) + fetchURL;
console.log('REQ-URL:', requestURL);
var requestparam =
'auth=' + (await this.storage.get('token')) +
'&json=' + JSON.stringify(await this.storage.get('Orders'));

var xhr = new XMLHttpRequest();
xhr.open('POST', requestURL, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
var status = xhr.status;
if (status >= 200 && status < 400) {
console.log('connection OK');
let connection = "ok";
callback(connection);
} else {
console.log('connection BAD');
let connection = "bad";
callback(connection);
}
}
}

xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
xhr.send(requestparam);
}
}
}

Answer 1

OK这里有一个新的fetch()工作方法和Postman的一些帮助。每当网络出现问题时，它都会抛出一个错误，或者如果获取到达另一端，它会返回一个状态响应。在这里，我仍然可以使用我需要的全局变量。

async do() {  
let myHeaders = new Headers();
myHeaders.append("Content-Type", "application/x-www-form-urlencoded");

let urlencoded = new URLSearchParams();
urlencoded.append("auth", await this.storage.get('token'));
urlencoded.append("json",  JSON.stringify(await this.storage.get('Orders')));

let requestOptions = {
method: 'POST',
headers: myHeaders,
body: urlencoded,
}

fetch("url/to/fetch", requestOptions)
.then(async response => {

console.log("STATUS",response.status);
if (response.status == 200) {
await this.storage.remove('Orders');
this.router.navigate(['somewhere'])
}})
.catch(error => {
console.log('error', error);
this.router.navigate(['somwhere-else'])
})