Question

在前端使用引导程序在Meteor中构建应用程序，我在filepicker小部件中遇到了一些令人困惑的行为。它需要一个明显的间隔才能正确呈现，但更令人不安的是，在上传完成后，窗口小部件呈现错误，并且无法上传更多内容。

- 后来的工作发现了一个重要的事实！当模板本身重新呈现时，小部件会中断，无论它是由上载还是由页面上的其他交互引起。

这是标记：

 <form class="form-horizontal">
     <div class="control-group" >
        <label class="control-label" for="uploadButton">
          Uploads &nbsp
        </label>
        <div class="contols" > 
          <input type="filepicker-dragdrop"
             data-fp-button-class="btn"
             data-fp-drag-text="Drop files here"
             data-fp-drag-class="span5"
             data-fp-multiple="true" id="uploadButton"/>
        </div>
      </div>
 </div>

和客户端代码（来自事件地图）：

 'change #uploadButton' : (event) ->
            console.log JSON.stringify event.fpfiles

            resources = _.map(event.fpfiles, (file) ->
                    url : file.url
                    title : ""
                    date : ""
                    media : ""
                    size : "")
            Session.set('uploadedResources', _.union(resources, Session.get 'uploadedResources'))

这些东西都按预期工作 - uploadedResources在相关的jQuery .sortable中正确使用;但是，上传窗口小部件将重新呈现为文本输入，并在输入字段中显示上载文件的URL。查看文档上的示例可以发现这不是预期的行为。我想要做的是确保我可以继续使用上传小部件将文件添加到.sortable（此时，用户可以复制上传的文件是完全可以接受的 - 我意识到__union呼叫实际上并没有完成提议的工作）

我不确定这里的渲染过程是什么：它是Meteor模板问题吗？引导？或者我是不是用小部件代码做正确的事情？我也尝试用{{#isolate}}和{{#constant}}指令（以及两者一起）包装表单，但没有用。

如果我将filepicker.constructWidget（）内容添加到template.rendered事件处理程序中，那么一切正常;但是，我很高兴知道这是如何工作的......也就是说，我宁愿在模板中声明小部件，这看起来更具可读性。

Filepicker小部件在上传后中断

0 个答案: