2014-10-02 7 views
9

Ember가 요소의 ID를 생성하고 싶습니다. 같은 렌더링Emberjs가 컨트롤러에서 요소 ID를 생성하는 방법

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

:

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

내가 컨트롤러 내부의 각 div 요소의 ID를 얻을 필요가있다. 사용자 정의 ID를 사용해야한다면 어떻게 엠 버보기를 사용하여 사용자 정의 ID를 작성할 수 있습니까?

그리고 어떻게 컨트롤러 내부 ID로 각 div 요소를 식별 할 수 있습니까?

답변

13

말인지 정확히 모르겠지만, 나는 대답 할 수

을 어떻게 내가 컨트롤러 내부 ID로 각 div 요소를 식별 할 수 있습니까? 을 console.log에서

Working Example 봐는 요소 ID를 참조하고 ID가 동일한 지 확인하기 위해 구성 요소를 검사하는 구글 크롬이나 파이어 버그를 사용합니다. 구성 요소 내부

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

this

구성 요소이며, (당신이 구성 요소 내부 tagName를 사용하는 경우 또는 다른 태그) elementId로부터는 사업부의 id을 가져옵니다.

당신이 JQuery와 함께 구성 요소를 선택합니다

는 사용 this.$()를 구성 요소의 내부. 난 당신이 내가 몇 가지 제안을 던질거야 필요가 모르는 경우 지금 여기

이다. 컨트롤러에서 모든 구성 요소의 ID를 알아야 할 경우 구성 요소에 컨트롤러에있는 배열을 전달하는 것이 좋습니다. didInsertElement에서 elementId 또는 jQuery 개체를 배열에 추가합니다. Here is what I mean

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

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

그리고 당신의 구성 요소에 속성을 전달합니다 {{item-one array=controller.componentIds}}

또한 this.sendAction('actionName', componentId)과 행동을 통해 구성 요소의 ID 또는 jQuery 개체를 보내고 하나 개의 매개 변수를 컨트롤러에 정의 된 액션을 가질 수

(즉, 한 ComponentID 또는 jQuery 오브젝트.

3

가 HTML에 삽입되기 전에 당신은 또한 emberId 처리 할 수 ​​있습니다.

(210)
0

당신은 elementId property를 사용하여 구성 요소에 대한 사용자 ID를 만들 수 있습니다.

당신은 너무

{{my-component elementId="your-id-name"}} 

처럼 또는 구성 요소 파일의 구성 요소 템플릿을 결합하여 ID를 만들 수 있습니다

export default Ember.Component.extend({ 
    elementId: 'your-id-name' 
}); 
관련 문제