Javascript 余烬：将属性添加到由助手生成的元素

我有以下模板文件：

<h2 style="margin-top: 20px" class="ui header">{{t 'Unscheduled Sessions'}}</h2>
<div id="sessions-list">
  {{#each unscheduled as |session|}}
    {{#draggable-object content=session}}
      <div class="unscheduled" data-toggle="tooltip" data-animation="false" data-placement="top" draggable="true">
        <span class="text">
          {{session.title}} | 
        </span>
        {{#each session.speakers as |speaker|}}
          <span class="text speaker">
            {{speaker.name}}
          </span>
        {{/each}}
      </div>
    {{/draggable-object}}
  {{/each}}
</div>

{{t'计划外会话}
{{{#每一次非计划的会议}
{{{#可拖动对象内容=会话}
{{session.title}}}
{{{#每届会议.发言者为|发言者}
{{speaker.name}
{{/每个}}
{{/可拖动对象}
{{/每个}}

---

我想向

{{draggable object…}

帮助程序生成的元素添加一个

data

属性。该属性的值本质上应为

会话

，而与

内容

不同。您知道如何实现这一点吗？

要将自定义data-*属性添加到现有插件的组件中，首先需要导入该组件，将其扩展为包含data-*属性，然后在应用程序中使用扩展组件

生成您自己的组件，比如说

数据可拖动

，并将类似的内容放入组件JS中。在这里，我们从addon

ember拖放导入组件，然后向其中添加自定义元素属性所必需的
attributeBindings
功能

import Component from 'ember-drag-drop/components/draggable-object';

export default Component.extend({
    attributeBindings: ['data-event']
});

然后，您可以在模板中使用扩展组件，而不是直接使用附加组件：

{{#data-draggable content=this data-event="some data thing"}}
   some stuff
{{/data-draggable}}

您应该看到结果标记上的
data event=“some data thing”
属性

请参阅添加指南，这是您控制的组件。
可拖动对象是您控制的组件吗？这有用吗@车把-它是第三方助手。我想向其添加
data-*
属性，但无法添加。好的，也许您可以导入并扩展插件组件，如下所述@handlebears尝试了近5个小时：（这听起来很令人沮丧。你遇到了什么问题？我自己从来没有尝试过，但也许其他人可以经常插话，但我最终解决了这个问题，删除了这个附加组件并导入了
jqueryui
，然后通过
jqueryui
界面拖动会话。不用担心，很高兴你找到了一个解决方案。）谢谢你抽出时间来帮我。