如何让Emberjs在控制器中生成元素id

Question

我想得到Ember生成的元素id.

{{#each}}
<div>
 <h1>{{MyComponent}}</h1>
</div>
{{/each}}

它呈现如下:

<div id="ember180" class="ember-view">
 <h1>My Component here</h1>
</div>

我需要在控制器中获取每个div元素的id.如果我要使用自定义ID,那么如何使用ember视图创建自定义ID.

如何通过控制器内的id识别每个div元素？

Answer 1

我不确定你的意思,但我可以回答:

如何通过控制器内的id识别每个div元素？

工作示例查看console.log以查看元素ID,然后使用Google Chrome或Firebug检查组件元素以查看id是否相同.

App.ItemOneComponent = Ember.Component.extend({
  didInsertElement: function(){
    console.log('element id: ' + this.elementId);
  }
});

this组件内部是组件,elementId获取iddiv(如果tagName在组件内部使用,则获取不同的标签).

如果要使用JQuery选择组件,请使用:this.$()组件内部.

现在这里我不知道你需要什么,所以我会抛出一些建议.如果您需要知道控制器中每个组件的ID,我建议将控制器中的数组传递给组件.在你的didInsertElement,添加elementId或jQuery对象数组.这就是我的意思

App.IndexController = Ember.ArrayController.extend({
  componentIds: []  
});

App.ItemOneComponent = Ember.Component.extend({
  didInsertElement: function(){
    this.get('array').pushObject(this.elementId);
  }
});

并且您的组件传递属性: {{item-one array=controller.componentIds}}

您还可以jQuery通过操作发送组件的id或对象,this.sendAction('actionName', componentId)并在控制器上定义一个带有一个参数的操作(即componentId或jQuery对象).