我有一段代码发出http请求以获取客户端地理位置,然后使用http.get作为参数将其发送到我的API,我已经正确完成了这两项工作,但是我坚持制作异步函数,我想获取地理位置,当它完成并且我得到它时,我想向我的API发出请求, 我已经尝试了许多关于堆栈溢出的教程和类似问题,但我无法正确处理,有人可以建议我的代码出了什么问题吗?
这是代码:
@Injectable()
export class ProductsService {
public currency: string = '';
public catalogMode: boolean = false;
public compareProducts: BehaviorSubject<Product[]> = new BehaviorSubject([]);
public observer: Subscriber<{}>;
public static productList$: Observable<Product[]> = new Observable;
public static test: boolean = false;
public ipAddress: string;
public country: string;
// Initialize
constructor(private http: Http, private toastrService: ToastrService) {
this.getIp();
this.compareProducts.subscribe(products => products = products);
}
// Observable Product Array
private products(): Observable<Product[]> {
ProductsService.productList$.subscribe(p => {
if (p.length != 0) {
ProductsService.test = true;
}
});
if (!ProductsService.test) {
this.currency = this.getCurrency(this.country); //prints counrty = undefined currency = USD
console.log('currency 1 = ' + this.currency); // prints defualt currency USD?
ProductsService.productList$ = this.http.get('http://localhost:8080/products/getAllProducts?currency='+this.currency).map((res: any) => {
ProductsService.test = true;
this.currency = this.getCurrency(this.country); // calling the function here works as I want
console.log('currency 2 = ' + this.currency); // prints the expected values
return res.json();
});
}
return ProductsService.productList$;
}
// Get Products
public getProducts(): Observable<Product[]> {
return this.products();
}
async getIp() {
await this.http.get(('http://ip-api.com/json/' + '?fields=countryCode')).toPromise().then(r => {
this.country = r.json().countryCode;
});
}
private getCurrency(country: string): string {
if (country === 'JO') {
this.currency = 'JOD';
} else if (country === 'AE') {
this.currency = 'AED';
} else if (country === 'SA') {
this.currency = 'SAR';
} else if (country === 'GB') {
this.currency = 'GBP';
} else if (country === 'DE') {
this.currency = 'EUR';
} else if (country === 'KW') {
this.currency = 'KWD';
} else if (country === 'EG') {
this.currency = 'EGP';
} else {
this.currency = 'USD';
}
console.log("counrty = " + country + " currency = " + this.currency); //prints counrty = GB currency = GBP
return this.currency;
}
}
运行代码时,控制台将输出:
counrty = undefined currency = USD
currency 1 = USD
counrty = GB currency = GBP
currency 2 = GBP
counrty = GB currency = GBP
currency 2 = GBP
Async/Await 并不是那样工作的。你必须将承诺分配给一个变量,如下所示:
async getIp() {
const resposne = await this.http.get('http://ip-api.com/json/' + '?fields=countryCode').toPromise();
..... do stuff with your response ....
}
您可以在getProducts()
中调用await this.getIp()
以等待其完成。
import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { HttpClient } from '@angular/common/http';
import { map, switchMap } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class ProductsServiceService {
private products: Product[];
// Initialize
constructor(private http: HttpClient) {
}
// Get Products
public getProducts(): Observable<Product[]> {
if (this.products) {
return of(this.products);
} else {
return this.getIp().pipe(
switchMap(country => {
const currency = this.getCurrency(country);
console.log('currency 1 = ' + currency);
return this.http.get('http://localhost:8080/products/getAllProducts?currency=' + currency).pipe(
map((res: any) => {
console.log('currency 2 = ' + currency); // prints the expected values
return res.json();
})
);
})
);
}
}
getIp() {
return this.http.get<any>(('http://ip-api.com/json/' + '?fields=countryCode')).pipe(
map(r => r.json().countryCode)
);
}
private getCurrency(country: string): string {
let currency;
if (country === 'JO') {
currency = 'JOD';
} else if (country === 'AE') {
currency = 'AED';
} else if (country === 'SA') {
currency = 'SAR';
} else if (country === 'GB') {
currency = 'GBP';
} else if (country === 'DE') {
currency = 'EUR';
} else if (country === 'KW') {
currency = 'KWD';
} else if (country === 'EG') {
currency = 'EGP';
} else {
currency = 'USD';
}
console.log('counrty = ' + country + ' currency = ' + currency);
return currency;
}
}