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

本文介绍了如何让控制器中的Emberjs生成元素id的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

{{每个}} < DIV> < h1> {{MyComponent}}< / h1> < / div> {{/ each}}

其中显示如下：

< div id =ember180class =ember-view> < h1> My Component here< / h1> < / div>

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

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

解决方案

我不确定你的意思，但我可以回答：

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

a href =emberjs.jsbin/nogogehowuyu/1/edit?html,css,js,console,output>工作示例查看console.log以查看元素id和然后使用Google Chrome或Firebug来检查组件元素，以查看该ID是否相同。

App.ItemOneComponent = Ember.Component.extend（{ didInsertElement：function（）{ console .log（'element id：'+ this.elementId）; } }）;

这个组件内部是组件，而elementId可以获取div的 id （如果您在组件中使用 tagName ，则可以使用不同的标签）。

如果要使用JQuery选择组件，请在组件内部使用：$（code）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 =您可以发送组件的id或 jQuery 对象通过使用 this.sendAction（'actionName'，componentId）的操作，并在控制器上定义了一个操作，该操作需要一个参数（即componentId或jQuery对象。 p>

I would like to get the Ember generated id of an element.

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

which render something like:

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

I need to get the id of each div element inside a controller. If I've to use custom id then how can I create custom id using ember view.

And how can I identify each div element by its id inside controller?

解决方案

I'm not sure exactly what you mean, but I can answer:

And how can I identify each div element by its id inside controller?

Working Example Look at the console.log to see the element id, and then use Google Chrome or Firebug to inspect the component element to see that the id is the same.

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

this inside the component is the component, and elementId gets the id of the div (or different tag if you use tagName inside the component).

If you want to select the component with JQuery, use: this.$() inside of the component.

Now here is where I don't know what you need so I'm going to throw out a few suggestions. If you need to know the ids of every component from the controller, I would recommend passing in an array sitting on the controller to the component. In your didInsertElement, add the elementId or the jQuery object to the array.Here is what I mean

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

And your component passes the property in: {{item-one array=controllerponentIds}}

You could also send the component's id or jQuery object via an action with this.sendAction('actionName', componentId) and have an action defined on your controller that takes one parameter (ie the componentId or the jQuery object.