【问题标题】:Default value for input type file in MeteorMeteor 中输入类型文件的默认值
【发布时间】:2023-04-03 11:35:01
【问题描述】:

我有一个输入类型文件来上传图像。我还想为其设置一个默认图像,以便如果用户不上传任何默认图像,则保存/使用默认图像。如何做到这一点?

Template.modelMeta.events({
    'submit #uploader-form': function(e, t)
    {



    file = $('#desc-model-thumb') // id for input type = file

    var fsFile = new FS.File(e.target[2].files[0]);


    ThumbFiles.insert(fsFile,function(err,thumbFile) {
        if (err) {
        sAlert.error("No image or invalid image format selected", {effect: 'flip', onRouteClose: false, stack: false, timeout: 8000, position: 'top'});
        } else {
        sAlert.success("Image has been Uploaded", {effect: 'flip', onRouteClose: false, stack: false, timeout: 4000, position: 'top'});     
        ModelFiles.update(modelId, {$set: {name: filename, about: description, thumbnail:thumbFile._id}}, function(error, res) {
            if (error) {
            sAlert.error(error.reason);
            } else {
            sAlert.success("Data about model has been saved", {effect: 'flip', onRouteClose: false, stack: false, timeout: 4000, position: 'top'});
            }
        });

        }
    }); 
    } 
});

这是一个模板

    <label for="filename" class ="input-head"> Model-Image </label>
    <p class ="help-text"> An image that will be used as a thumbnail for your model, the preferred size is 500 X 300 </p>   
    <input class="form-control model-thumb" id="desc-model-thumb" name="modelThumb" type="file">

收藏

ThumbFiles = new FS.Collection ("thumbFiles", {
    stores: [
    new FS.Store.FileSystem("thumbFiles")
    ],
    filter: {
    allow: {
        contentTypes: ['image/png', 'image/jpeg', 'image/jpg']
        // extensions: ['jpg']
    }
    }   
});

【问题讨论】:

  • 您能在问题中添加更多细节吗?你怎么知道用户是否已经上传了一张图片(链接是否存储在她的个人资料中)?
  • 我更新了我的帖子。请检查
  • 有人请帮忙。

标签: javascript meteor


【解决方案1】:

如果用户没有定义一个默认文件,我只会链接一个:

defaultSAlert = {
  effect: 'flip',
  onRouteClose: false,
  stack: false,
  timeout: 8000,
  position: 'top'
}

function insertImage (fsFile, modelId, description) {
  ThumbFiles.insert(fsFile,function(err,thumbFile) {
    if (err) {
      return sAlert.error("No image or invalid image format selected", defaultSAlert);
    }
    sAlert.success("Image has been Uploaded", defaultSAlert);
    updateModelFiles({
      _id: modelId,
      thumbnail: thumbFile._id,
      name: thumbFile.original.name,
      description: description
    })
  });
}

function updateModelFiles (model) {
  ModelFiles.update(modelId,
    {
      $set: {
        name: filename,
        about: description,
        thumbnail: fileId
      }
    }, function(error, res) {
      if (error) {
        return sAlert.error(error.reason);
      }
      sAlert.success("Data about model has been saved", defaultSAlert);
    }
  );
}

Template.modelMeta.events({
  'submit #uploader-form': function(e, t) {
    file = $('#desc-model-thumb') // id for input type = file
    if(file.files.length) {
      insertImage(
        new FS.File(file.files[0]),
        undefined,
        undefined
      )
    } else {
      var defaultModel = ModelFiles.findOne({ $eq:{name: 'defualt.png'} })
      defaultModel._id = undefined
      updateModelFiles(defaultModel)
    }
  }
});

请注意,在我调用 insertImage 函数时,我使用了两次 undefined。那是因为我不知道 descriptionmodelId 应该是什么。另外,我会尝试正确缩进你的东西。它几乎无法阅读您发布代码的方式。并使用 2 个空格 进行缩进。这是约定。

【讨论】:

  • 好的,下次我会注意的,非常感谢。但是在这样做之后,页面会被引用并且没有默认值,甚至没有图像被上传。
  • 抱歉,还有一些我之前没有发现的错误。我修好了它们。您是否替换了代码中的undefineds?
  • 是的,我替换了它们 :(
  • 你可以看到我的编辑here。还有一个区别here
猜你喜欢
  • 2018-01-14
  • 2011-07-05
  • 2021-04-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-04-27
  • 2016-09-09
相关资源
最近更新 更多