javascript - 单击 Ember 中的按钮添加 Handlebars 代码

Question

我正在使用 Ember，点击按钮后，我想在我的页面上添加以下代码:

<div class="clearfix input-file-line">
    <div class="input-file-float-block">
        <button class="btn btn-info">From your computer</button>
        {{input type="file" class="styled"}}
    </div>
    <div class="input-file-float-block">
    or
    </div>
    <div class="input-file-float-block">
        {{#view "cloudUpload"}}
            <button class="btn btn-info" {{action 'showModalForCloudFiles'}} >from a cloud</button>
        {{/view}}
    </div>
</div>

每次我点击按钮时，我想显示这个 block 。例如，如果用户点击按钮 3 次，我想显示 3 次该 block 。

你有什么想法以一种干净的方式做到这一点吗？

感谢您的回答

Answer 1

您可以创建一个标志来显示或不显示该 block 。

isShowingUploadBlock: false,

actions: {
    // call this action from button
  showUploadBlock: function() {
    this.set("isShowingUploadBlock", true);
  }
}

在模板中:

{{#if isShowingUploadBlock}}
<div class="clearfix input-file-line">
  ...
</div>
{{/if}}

如果您愿意，也可以在 div 上切换类。