画像がファイルロゴとして表示されるのはなぜですか？AngularJSを使用してWebページに画像を追加する
This is how my image shows up when I add it
下記のリンクこれは、画像（AngularJS）のための私のJS
{
name: 'Screw',
price: 1,
description: 'A small item drilled into objects',
specs: '1 centimeter',
images: [
{
full: "1024px-Phillips_screw.jpg"
}
]
}
これは私のHTMLは、画像
<img ng-src="{{product.images[0].full}}"/>
なぜ使用しないng-src directive？ すなわち。
<div ng-init="myVar='pic_angular.jpg'">
<h1>Angular</h1>
<img ng-src="{{myVar}}">
</div>
これはこれを行う正しい方法です。プレーン 'src'を使用すると、ブラウザは' src'で与えられた補間されていないテキストを読み込み、テキストが補間されたときに**別の**ネットワークリクエストを発射しようとするので、余分なネットワークコールを受け取ります。 – zero298
ありがとうございます@ zero298はい、はるかにクリーンなアプローチ。 –
あなたは毎日何か新しいことを学びます。ありがとうございます@ zero298、あなたの答えは私のものより良い意味があります、良いもの！ –
エラーのコンソールをチェックしてくださいを追加するためでありますおそらくパスが正しくないためです。
彼らはあなたのイメージにしている場合は、そのパスを入れたいと思いフォルダ：NG-SRCに画像の名前だけを渡し
<img src="/images/{{product.images[0].full}}"/>
これは不正な方法です。 swordfishの答えに対する私のコメントは、ブラウザが 'src'で与えられた補間されていないテキストを読み込み、次に**別の**ネットワークリクエストを発射しようとすると、余分なネットワークコールを得るでしょう。テキストが補間されます。 – zero298
@ zero298が正しいです。ウィリアムハンプシャー助けてくれてありがとう –
確かに@TheWorldSoul。それが私には発生しませんでした。それが私がこの場所を愛する理由です！ –
ITSは、あなたはそれが保存された画像の全体のパスを記述する必要がありますイメージ名を中括弧に渡す前に。
あなたは、あなたがCLIを使用して、最新のangularjs 4.xを使用する場合は、あなたがangular-の「資産」セクションにイメージのパスを追加する必要が
<img src="/images/{{product.images[0].full}}"/>
のように、画像のための絶対パスまたは相対パスを使用する必要がありますcli.json：
"アプリケーション"：[{ ......
"assets": [
"assets",
"favicon.ico",
"images"
],
........
}
ええ、ファイルパスを使用して、ありがとう@ブロックチェーンNerd。まだAng4で快適ではない –
この回答は、あなたが投稿する前に30分前に提案されました... –
画像のパスは何ですか？パスを確認してください。そのイメージ名です –
提供されたリンクが壊れています –
イメージをフルパスで確認し、 'ng-src'値と比較してください。 –