2013-09-27 3 views
2

컨트롤러에서 정의한 컬렉션을 반복합니다.ember metamorph를 사용하지 않으려면 어떻게해야합니까?

저는 이것을 회전 목마로 바꾸기 위해 기초 궤도 플러그인을 사용하고 있습니다.

그러나 내 HTML이 엉망이되고 있으며 특정 출력을 기대하기 때문에 플러그인이 망가져 있습니다.

<ul class="orbit-slides-container" data-orbit="" style="margin-left: -800%; width: 1000%; height: 217px;"><script id="metamorph-3-end" type="text/x-placeholder" data-orbit-slide="" style="width: 10%;"></script> 
     <script id="metamorph-3-start" type="text/x-placeholder" class="" style="width: 10%;"></script><script id="metamorph-1-start" type="text/x-placeholder" style="width: 10%;" class=""></script> 
     <li style="width: 10%;" class=""> 
      <script id="metamorph-4-start" type="text/x-placeholder"></script>true<script id="metamorph-4-end" type="text/x-placeholder"></script> 
      <img src="source"> 
     </li> 
     <script id="metamorph-1-end" type="text/x-placeholder" style="width: 10%;" class=""></script><script id="metamorph-2-start" type="text/x-placeholder" style="width: 10%;" class=""></script> 
     <li style="width: 10%;" class=""> 
      <script id="metamorph-5-start" type="text/x-placeholder"></script>true<script id="metamorph-5-end" type="text/x-placeholder"></script> 
      <img src="src"> 
     </li> 
     <script id="metamorph-2-end" type="text/x-placeholder" style="width: 10%;" class=""></script><script id="metamorph-3-end" type="text/x-placeholder" style="width: 10%;" class="active"></script> 
    <script id="metamorph-3-start" type="text/x-placeholder" data-orbit-slide="" style="width: 10%;"></script></ul> 

맹 글링이되지 않도록하려면 어떻게해야합니까? 기본적으로 모든 변태 물건을 제거하십시오.

답변

1

metamorph를 사용하지 않도록보기의 사용자 지정 렌더링을 수행 할 수 있습니다.

Here is a blog 게시판에 사용자 정의 렌더링보기가 나와 있습니다. (약간 날짜가 있지만 사용자 지정 렌더링의 핵심 부분은 관련이 있습니다.) 메서드를 뷰에 정의한 경우 pushbuffer 인수로 DOM에 저장됩니다.

Discourse.HotnessView = Discourse.View.extend({ 
    classNames: ['hotness-control'], 

    render: function(buffer) { 
    for (var i=1; i<12; i++) { 
     buffer.push("<button value='" + i + "'"); 
     if (this.get('hotness') === i) { 
     buffer.push(" class='selected'"); 
     } 
     buffer.push(">" + i + "</button>"); 
    } 
    } 
}); 
관련 문제