106

HTMLでレンダリングされる画像のソース文字列をAngularJSコントローラーに保存していますが、Angularコントローラーが初期化される前に404が生成されます。

HTMLは次のとおりです。

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

角度コントローラー：

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

そして、私が得るエラー（テンプレート%7D%7Dのに対応します）。{{

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

どうすればこれを防ぐことができますか？つまり、Angularコントローラーが初期化されたときにのみ画像をロードしますか？

4

2 に答える 2

230

詳細については、 srcをng-srcに置き換えてみてください。ドキュメントを参照してください。

src属性で{{hash}}のようなAngularマークアップを使用すると、正しく機能しません。Angularが{{hash}}内の式を置き換えるまで、ブラウザはURLからリテラルテキスト{{hash}}をフェッチします。ngSrcディレクティブはこの問題を解決します。

 <div ng-controller="Cont">
      <img ng-src="{{imageSource}}">
 </div>
于 2012-10-16T20:00:09.877 に答える
6

誰かがbackground-imageのスタイリングのソリューションを検索している場合は、次を使用します。

<div ng-style="{'background-image': 'url({{ image.source }})'}">...</div>
于 2016-01-26T10:48:53.157 に答える