In my Component, there is a function that is supposed to return a value (Promise). This value requires information from two distinct sources: an API call and data from a database.
The method in question looks like this:
public getValue(): Promise<number> {
return this.dataProvider.loadData().toPromise().then(data => {
return data.feePerc
}).then(feePerc => {
let url = `${apiUrl}/mycontroller/value`
return new Promise<number>(resolve => {
return this.http.get(url)
.map(response => {
let value = response.json()
return resolve(value * (1 + (feePerc / 100)))
})
})
})
}
However, the function does not work as intended. While the feePerc value is returned successfully, using http.get within a Promise seems to be causing issues. The map() function is never executed.
I initially thought about handling these asynchronous functions simultaneously and synchronizing their results before returning the final outcome. Despite struggling with an elegant solution using promises, I have yet to figure out a proper chained approach.
package.json:
- "@angular/core": "4.2.5",
- "rxjs": "5.4.2",