Gambar Dapatkan Permintaan dengan AngularJS

Saya menyimpan string sumber gambar yang akan ditampilkan dalam HTML di pengontrol AngularJS, namun menghasilkan 404 sebelum pengontrol Angular diinisialisasi.

Ini HTML-nya:

 <div ng-controller="Cont">
      <img src="{{imageSource}}">
 </div>

Pengontrol sudut:

 var Cont = function($scope) {
      $scope.imageSource = '/tests.png';
 }

Dan kesalahan yang saya dapatkan ( %7D%7Dsesuai dengan {{di template).

 GET https://localhost:9000/%7B%7BimageSource%7D%7D 404 (Not Found) 

Bagaimana cara mencegah hal ini terjadi? Artinya, hanya memuat gambar ketika pengontrol Angular telah diinisialisasi?

Coba ganti src Anda dengan ng-src untuk info lebih lanjut, lihat dokumentasinya :

Menggunakan markup Angular seperti {{hash}} di atribut src tidak berfungsi dengan benar: Browser akan mengambil dari URL dengan teks literal {{hash}} sampai Angular menggantikan ekspresi di dalam {{hash}}. Direktif ngSrc memecahkan masalah ini.

 <div ng-controller="Cont">
      <img ng-src="{{imageSource}}">
 </div>

Jika seseorang mencari solusi untuk menata gambar latar belakang, gunakan ini:

<div ng-style="{'background-image': 'url({{ image.source }})'}">...</div>