应用[style.background-image]时如何解决承诺

Question

我有这样的div：

<div [style.background-image]="'url(' getImageFunction() ')'">
</div>

问题是getImageFunction()返回一个承诺。如何解决获取图片网址的承诺？

我试过这样做，但显然没有用

<div style="background-image: url('{{getImageFunction() | async}}');">
</div>

Answer 1

建议用变量保持简单。因为异步调用被无限期调用，如@ developer033所说，哪个是正确的

可以使用变量

来处理它

<div [style]="showUrl ? background-image: url('demo.jpg') : null ">
</div>

并在.ts处理bool值showUrl

this.getImageFunction().then(() => {
   this.showUrl = true;
}, () => {
   this.showUrl = false;
})