[英]Retuning values from HTTP POST instead of Observable
I'm working on a city based angular application.我正在开发一个基于城市的 angular 应用程序。
place_id
value. place_id
值。place_id
getPlacesPhotoRef
should return 10 photo ref.place_id
getPlacesPhotoRef
应该返回 10 张照片参考。 What I'm trying to do is, I wanted the photo ref
to be pushed to photo's array.我想要做的是,我希望将
photo ref
推送到照片的数组。
expected output.预计 output。
{
formatted_address: 'xxx',
place_id: 'xxx',
photos: [...] //All 10 photo ref
}
But issue is, instead of values, I see Observable getting returned in the photos array.但问题是,我看到 Observable 在照片数组中返回,而不是值。
Below is my code下面是我的代码
getPlaceId(cityName) {
let httpPath = `http://localhost:5001/calvincareemailservice/us-central1/webApi/api/v1/getplaces`;
return this.http.post(httpPath, { city: cityName }).subscribe(res => {
if (res) {
let data = JSON.parse(JSON.stringify(res));
this.placeIds.push({
formatted_address: data.candidates[0].formatted_address,
place_id: data.candidates[0].place_id,
photos: this.getPlacesPhotoRef(data.candidates[0].place_id)
.subscribe(res => {
let data = JSON.parse(JSON.stringify(res));
return data.result.photos.map(pic => pic.photo_reference);
})
}
);
}
});
}
getPlacesPhotoRef(id) {
let httpPath = `http://localhost:5001/calvincareemailservice/us-central1/webApi/api/v1/getplacesid`;
return this.http.post(httpPath, { placeId: id })
}
You are very close and thinking about the problem correctly, but the issue is you have assigned an Observable subscription to your photos
key rather than the data the .subscribe()
actually returned, which I would imagine is what you had hoped you were doing.您非常接近并且正确地考虑了这个问题,但问题是您已经为您的
photos
键分配了一个 Observable 订阅,而不是.subscribe()
实际返回的数据,我想这就是您希望自己在做的事情。
At a high level, what you want to do is push a new object to this.placeIds
once you have all of the information it needs, eg formatted_address
, place_id
and photos
.在高层次上,您要做的是将新的 object 推送到
this.placeIds
,一旦您拥有它需要的所有信息,例如formatted_address
、 place_id
和photos
。 So what you need to do here is:所以你需要在这里做的是:
/getplaces
endpoint and store the place data/getplaces
端点并存储地点数据/getplacesid
endpoint using data.candidates[0].place_id
and store the photos datadata.candidates[0].place_id
调用/getplacesid
端点并存储照片数据this.placeIds
this.placeIds
Simple example with nested .subscribe()
calls:嵌套
.subscribe()
调用的简单示例:
getPlaceId(cityName) {
const httpPath = `http://localhost:5001/calvincareemailservice/us-central1/webApi/api/v1/getplaces`;
return this.http.post(httpPath, { city: cityName })
.subscribe(res => {
if (res) {
const data = JSON.parse(JSON.stringify(res));
const formatted_address = data.candidates[0].formatted_address;
const place_id = data.candidates[0].place_id
this.getPlacesPhotoRef(place_id)
.subscribe(res => {
const data = JSON.parse(JSON.stringify(res));
const photos = data.result.photos.map(pic => pic.photo_reference)
this.placeIds.push({
formatted_address,
place_id,
photos
})
})
);
}
});
}
Note: A more elegant way to do this would be to use concatMap
注意:更优雅的方法是使用
concatMap
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.