Maison > interface Web > tutoriel CSS > le corps du texte

Comment éviter les erreurs d'image d'arrière-plan causées par des URL invalides dans AngularJS ?

DDD
Libérer: 2024-11-05 04:38:01
original
717 Les gens l'ont consulté

How to Prevent Background Image Errors Caused by Invalid URLs in AngularJS?

Erreurs d'image d'arrière-plan avec des URL non valides dans AngularJS

Dans AngularJS, la balise ng-src garantit que les URL avec des variables dynamiques ne provoquent pas d'erreurs avant qu'Angular ne les évalue. Cependant, une erreur similaire se produit souvent lors de la définition des images d'arrière-plan à l'aide de background-image:url(...).

Cela se produit car Angular n'évalue pas les variables dans les styles CSS. Par conséquent, lorsque vous utilisez des URL dynamiques pour les images d'arrière-plan, vous pouvez rencontrer un grand nombre d'erreurs, surtout si vous avez plusieurs DIV avec cette configuration.

Solution : liaison de style angulaire

Pour résoudre ce problème , vous pouvez utiliser la fonctionnalité de liaison de style d'Angular :

<li ng-style="{'background-image':'url(/static/'+imgURL+')'}">...</li>
Copier après la connexion

En enveloppant l'URL dynamique entre accolades dans la liaison de style angulaire, Angular garantit que l'URL est mise à jour une fois les variables évaluées, résolvant ainsi l'erreur et empêchant demandes d'images cassées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal