Quando dobbiamo mostrare un'immagine, spesso capita che dobbiamo deciderne l'url da codice. In questi casi possiamo mettere in binding la proprietà src del tag image con una proprietà dello scope.
<img src="{{imageUrl}}" alt="image"/>
Sebbene funzioni, questo approccio presenta un problema: quando il browser parsa il codice HTML effettua una richiesta all'url "{{imageUrl}}" andando ovviamente in errore. Quando poi il motore di binding di AngularJS trasforma l'espressione di binding nell'url reale dell'immagine allora viene nuovamente effettuata una richiesta per l'immagine.
Per evitare la doppia richiesta, possiamo utilizzare la direttiva ngSrc che effettua la chiamata per scaricare l'immagine solo dopo che il motore di binding ha impostato l'url reale.
<img ng-src="{{imageUrl}}" alt="image"/>
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Gestire query string lunghe in ASP.NET Core
Recuperare la data di creazione e ultima modifica di un record con Entity Framework Core e le temporal table di SQL Server
Le regole da seguire per effettuare la migrazione a Bootstrap 5
Creare classi CSS custom per Bootstrap 5
Impostare l'hostname di un'immagine docker per rendere il container da altri container in Visual Studio
Utilizzare il browser per rilevare Javascript e CSS non utilizzati nel codice
Ottimizzare il query plan di Sql Server nelle query LINQ che usano Contains
Utilizzare le Promise in Javascript - seconda parte
Esecuzione a matrici nei workflow di GitHub Action
Le novità di Angular 13 e del suo ecosistema
Scaling per app con Azure App Service
Utilizzare il metodo Chunk per creare blocchi di oggetti di uguali dimensioni partendo da una lista
I più letti di oggi
- Monitorare contemporaneamente i cambiamenti di più proprietà dello scope di AngularJS
- "welcome to the modern web development" con @dbochicchio e @kasuken, ora live per iniziare #PWAConfIT parleremo di #PWA e di come costruire applicazioni web moderne per tutto il pomeriggio. Seguiteci live su https://aspit.co/PWAConf-20 #aspilive
- Sfruttare le dipendenze con il model binding di ASP.NET Web Forms
- rilasciato #vs2017.5, con importanti aggiornamenti sulla velocità di caricamento dei progetti, supporto a C# 7.2 e nuove feature di Xamarin.disponibile inoltre anche #VS for #Mac, con sign integrato delle app iOS.altre informazioni su https://aspit.co/bkk
- Disabilitare un pulsante in Blazor durante il salvataggio