Angulaire: Comment lier des données une propriété asynchrone à une image d'arrière-plan

Question

• J'essaie de définir une image d'arrière-plan sur un div avec angulaire.
  • La 'image.imagrURL | async 'fonctionne bien en l'assignant simplement à une simple balise' img '.
  • La question que je vais avoir est en essayant d'attribuer à une image d'arrière-plan en ligne

La question est la suivante: Comment puis-je modifier mon ci-dessous extrait au travail? :)

HTML

<div [ngStyle]="{'background-image': 'url(' + image.imageurl | async + ')'}">

Erreur

Parser Error: Missing expected }

Je ne suis pas tout à fait sûr où cela est censé aller.

Merci.

Answer 1

supports Ajout seront aidés, parce que vous essayez tuyau async appel 'url(' + image.imageurl

Essayez de cette façon:

<div [ngStyle]="{'background-image': 'url(' + (image.imageurl | async) + ')'}">