无法在CollectionFS中为MeteorJS应用程序操作Images.find()

时间:2015-02-13 11:01:57

标签: mongodb collections meteor image-upload

我的应用程序有点像TelescopeJS,但更简单。我正在尝试回显在添加后的表单中添加的特定图像,该表单输入了帖子,图片,类别和描述的名称。它有2个集合,一个用于文章,另一个用于图像(不是mongo集合,它是FS集合。)文章集合存储名称,描述和类别名称,另一个存储图像。 **我的问题是:**在FS集合文档中,循环

{{#each images}}
    <img src="{{this.url}}" alt="" class="thumbnail" />
{{/each}}

图片:返回Images.find({}),我的文章代码为:

{{#each articles}}
    <li style="margin-right: 1%;">{{>article}}</li>  
{{/each}}

where articles:返回Articles.find({})

我的文章模板有图像循环,这会导致集合中的所有图像显示在一个帖子中。我只想要为特定帖子显示特定图像。

这些是事件:

'change .img': function(event, template) {
    FS.Utility.eachFile(event, function(file) {
      Images.insert(file, function (err, fileObj) {
        //Inserted new doc with ID fileObj._id, and kicked off the data upload using HTTP
      });
    });
  },
    'click .save':function(evt,tmpl){
        var description = tmpl.find('.description').value;
        var name = tmpl.find('.name').value;
        var date=new Date();
        var cat = tmpl.find('.selectCat').value;

        Articles.insert({
            description:description,
            name:name,
            time:date.toLocaleDateString()+' at '+date.toLocaleTimeString(),
            author:Meteor.userId(),
            userEmail:Meteor.user().username,
            category:cat,

        });
    }

   <template name="article">

     {{#each images}}
        <img src="{{this.url}}" alt="" class="thumbnail" />
        {{/each}}
    Here goes the {{name_of_post}}
    Here {{the_category}}
    Here {{the_description}}

    </template>

所以会发生的是,到目前为止我上传的所有图片都显示在一个帖子中,所有帖子的图片看起来都是一样的。求救!

1 个答案:

答案 0 :(得分:0)

你应该知道fsFile support Metadata所以也许你不需要Articles Collection

因此我们可以制作新的eventHandler

'click .save':function(evt,tmpl){
        var description = tmpl.find('.description').value,
            file = $('#uploadImagePost').get(0).files[0], //here we store the current file on the <input type="file">
            name = tmpl.find('.name').value,
            date=new Date(),
            cat = tmpl.find('.selectCat').value,
            fsFile = new FS.File(file); // we create an FS.File instance based on our file
          fsFile.metadata = {  //this is how we add Metadata aka Text to our files
                   description:description,
                   name:name,
                   time:date.toLocaleDateString()+' at '+date.toLocaleTimeString(),
                  author:Meteor.userId(),
                  userEmail:Meteor.user().username,
                  category:cat, 
                      }
          Images.insert(fsFile,function(err,result){
          if(!err){
            console.log(result) // here you should see the new fsFile instance
            }
       });
    }

这就是我们的新活动的样子,现在我们的.save按钮会在同一个集合中插入所有内容。

我们可以使用关键字FS.File访问'metadata.fieldName'个实例字段。

例如。

Teamplate.name.helpers({
  showCategory:function(){
    // var category = Session.get('currentCategory') you can pass whatever data 
    // you want here from a select on the html or whatever.
   //lets say our var its equal to 'Music'
    return Images.find({'metadata.category':category});
  } 
})

现在我们在html上使用该帮助器,就像任何普通集合一样

<template name="example">
  {{#each showCategory}}
    Hi my category is {{metadata.category}} <!-- we access the metadata fields like any normal field on other collection just remember to use the 'metadata'keyword -->
    This is my image <img src="{{this.url}}" >
  {{/each}}
</template>