我遇到的问题是应该从模板助手渲染的{{img}}似乎无法正常工作,我正在使用meteor-slinghsot pacakage。
我有以下模板助手
Template.postSubmit.helpers({
url: function () {
//if we are uploading an image, pass true to download the image into cache
//this will preload the image before using the remote image url.
var hello = this.uploader.url(true);
console.log(hello);
return this.uploader.url(true);
}
});
我有以下模板事件
Template.postSubmit.events({
'submit form': function(e) {
e.preventDefault();
$('#textArea.editable').editable({
success: function(response, newValue) {
alert("test");
}
});
var post = {
title: $(e.target).find('[name=title]').val(),
postContent: $(e.target).find('[name="postContent"]').val(),
image: imageLoad
};
Meteor.call('postInsert', post, function(error, result) {
// display the error to the user and abort
if (error)
return alert(error.reason);
// show this result but route anyway
if (result.postExists)
alert('This link has already been posted');
Router.go('postPage', {_id: result._id});
});
},
'change #fileUpload':function(event, template){
event.preventDefault();
var uploader = new Slingshot.Upload("myFileUploads");
var error = uploader.validate(document.getElementById('fileUpload').files[0]);
if (error) {
console.error(error);
}
var file = event.currentTarget.files[0];
console.log(file.name);
uploader.send(document.getElementById('fileUpload').files[0], function (error, downloadUrl) {
console.log(error);
console.log(downloadUrl);
imageLoad = downloadUrl;
Meteor.users.update(Meteor.userId(), {$push: {"profile.files": downloadUrl}});
});
}
});
我有以下html模板
<template name="postSubmit">
{{> dashboard}}
<p id="textArea" class="editable" data-type="textarea" data-placeholder="Enter text" data-emptytext="Click to enter text" data-rows="4">{{textAreaContent}}</p>
<img src={{url}}/>
<form>
<!-- <div>
<label for="url">URL</label>
<div>
<input name="url" id="url" type="text" value="" placeholder="Your URL" class="form-control"/>
</div>
</div> -->
<div class="postTitle">
<label class="titleLabel">Press Release Title</label>
<div class="input">
<input name="title" id="title" type="text" value="" placeholder="Title Here."/>
</div>
</div>
<div>
<div class="textarea">
<label class="contentLabel">Press Release content.</label>
<!-- <input name="postContent" id="postContent" type="text" value="" placeholder="Enwave has released a..."/> -->
<textarea name="postContent" id="postContent" type="text"></textarea>
</div>
</div>
<input id="fileUpload" type="file"/>
<input type="submit" value="Submit"/>
</form>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="{{progress}}" aria-valuemin="0" aria-valuemax="100" style="width: {{progress}}%;">
<span class="sr-only">{{progress}}% Complete</span>
</div>
</div>
</template>
答案 0 :(得分:0)
我不确定您希望使用您的代码实现什么,但这就是您的模板帮助程序无法正常工作的原因:
var hello = this.uploader.url(true);
this.uploader
未定义。它必须是发送文件的Slingshot.Upload
对象。