img src中的流星模板无法正常工作

时间:2015-11-17 22:09:03

标签: javascript meteor

我知道图像将保存在公用文件夹中,并且不会引用公用文件夹。以下是我正在使用的内容,我不能为我的生活找出导致图像无法加载的错误。

HTML:

<body>
{{>carousel}}
</body>
<template name="carousel">

    <div class="carousel">
        <span class="back">
            <a href="#">Back</a>
        </span>
        {{>carouselImages}}
        <span class="forward">
            <a href="#">Forward</a>
        </span>
    </div>
</template>

<template name="carouselImages">
    <img src="{{slide}}" height="200px" width="200px">
</template>

JavaScript的:

slideNumber = 0;



if (Meteor.isClient) {
        Template.carousel.events({
                'click .back': function(){
                    if (slideNumber == 0){
                        slideNumber = 4;
                    } else {
                        slideNumber++;
                    }
                },
                'click .forward': function(){
                    if (slideNumber == 4){
                        slideNumber = 0;
                    } else {
                        slideNumber--;
                    }
                }
        });

        Template.carousel.helpers({
            slide: function(slideNumber){
                switch(slideNumber) {
                    case 0:
                            return "21.png";
                            break;
                    case 1:
                            return "bj2.png";
                            break;
                    case 2:
                            return "vp.png";
                            break;
                    case 3:
                            return "vp2.png";
                            break;
                    case 4:
                            return "vp3b.png";
                            break;
                }
            }
        });
}

if (Meteor.isServer) {

}

1 个答案:

答案 0 :(得分:1)

您正在尝试引用全局变量(slideNumber)但提供本地重载(slide: function(slideNumber)),并且您未在模板中向slide提供任何参数。删除本地参数(见下文),或者以某种方式提供参数。

Template.carouselImages.helpers({
    slide: function() {
        switch(slideNumber) {
           ...
        }
    }
});