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
Utilizzare la session affinity con Azure Container Apps
Gestire liste di tipi semplici con Entity Framework Core
Gestire undefined e partial nelle reactive forms di Angular
Definire lo stile CSS in base alle dimensioni del container
Verificare la provenienza di un commit tramite le GitHub Actions
Effettuare il pull di git LFS in un workflow di GitHub
Usare un KeyedService di default in ASP.NET Core 8
Load test di ASP.NET Core con k6
Generare file per il download da Blazor WebAssembly
Eseguire attività pianificate con Azure Container Jobs
Utilizzare flat e flatMap per appiattire array innestati in array
Gestire domini wildcard in Azure Container Apps