画像が隕石で壊れた

私はMeteorの古いバージョンが使用され、ファイルとフォルダをどこに置くべきかわからないこのMeteorコースをやっています。私は私のメインフォルダ内にあるパブリックフォルダ内の画像と、次のmain.htmlをクライアントコード画像が隕石で壊れた

<head> 
    <title>image_share</title> 
</head> 
<body> 
    <h1>Welcome to Coursera!</h1> 

    {{>images}} 

</body> 

<template name="images"> 
    {{#each images}} 
     <img src="{{img_src}}" height="100" alt="{{img_alt}}" /> 
    {{/each}} 
</template>

と次のクライアントコードmain.js

if (Meteor.isClient) { 
    console.log("I am the client"); 

var img_data = [ 
    { 
     img_src:"image1.jpg", 
     img_alt:"dental surgery" 
    }, 

    { 
     img_src:"image2.jpg", 
     img_alt:"carribean night" 
    }, 

    { 
     img_src:"image3.jpg", 
     img_alt:"full moon palm tree" 
    }, 

]; 

Template.images.helpers({images:img_data}); 
}

を持っている私の問題はimage1.jpgですブラウザウィンドウに表示されます。

出典

2017-05-27 Chris Carr

あなたのヘルパーが機能する必要があります：

Template.images.helpers({ 
    images:function() { 
     return img_data; 
    }, 
});

そして、あなたのテンプレートで明示的に「これ」の文脈でループ内のデータを参照するのに良い：

{{#each images}} 
    <img src="{{this.img_src}}" height="100" alt="{{this.img_alt}}" /> 
{{/each}}

「これは」参照ここでは配列内の現在のオブジェクトに繰り返します。

出典

2017-05-27 07:43:22 Jankapunkt

フィードバックありがとうございます！あなたがアドバイスした変更を行いましたが、依然としてimage1だけがブラウザウィンドウに表示されています。 –

名前は正しいですか、タイプミスなどありませんか？パスは正しいですか？あなたのコードを仮定すると、イメージはサブフォルダと一緒にパブリックフォルダになければなりません。 – Jankapunkt

二重チェック、tribleチェック...パスと名前が正しい。パブリックフォルダ内のイメージで、サブフォルダではありません。 –

答えて

関連する問題