web-dev-qa-db-ja.com

AngularJSでの画像取得リクエスト

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コントローラーが初期化されたときにのみ画像をロードしますか？

javascripthttp-status-code-404angularjs
105
ssb

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

Angular src属性で{{hash}}のようなマークアップが正しく機能しない：ブラウザはAngularは{{hash}}内の式を置き換えます。ngSrcディレクティブはこの問題を解決します。

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

誰かが背景画像をスタイリングするためのソリューションを検索している場合、これを使用します：

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