사용자 정의 jquery 플러그인 내부에 링크 대상 속성을 사용하여 html을 만드는 방법은 무엇입니까?

Question

검색 상자의 html 드롭 다운을 만드는 데 사용하는 사용자 정의 jquery 플러그인이 있습니다. 그 안에 html이 다음과 같이 생성됩니다.

$.each(stack, function (i, stackItem) { 
        var url = _getItemURL(stackItem, lang); 

        if (stackItem.INS !== undefined) { 
         html += '<li class="row"> <a href="' + url + '">' + stackItem.DS_HIGHLIGHTED + ' - ' + stackItem.E + '<br>' + stackItem.TICKER_DESC + '</a> </li>'; 
        } else { 
         html += '<li class="row"> <a href="' + url + '">' + stackItem.COMPANY_DESC_HIGHLIGHTED + '<br>' /*+ _getCountry(stackItem.CC, lang)*/ + '</a> </li>'; 
        } 
        itemCount++; 
       }); 

위에서 볼 수 있듯이 href 속성은이 html로 링크를 만드는 데 사용됩니다. 그러나 사용자가 해당 링크를 클릭하면 응용 프로그램이 브라우저 페이지를 다시로드합니다. 나는

<li> {{#link-to 'stock-overview' 'en' 'tdwl' '1010'}}Stock{{/link-to}} </li> 

를 다음과 같이 올바르게 내가 이전에 자바 스크립트 코드 내부에 그런 식으로 HTML을 생성 할 수있는 방법 HBS 파일에 같은 응용 프로그램에서 다른 경로에 매핑 할.

감사합니다.

Answer 1

먼저 jQuery 플러그인이 필요하거나 평범한 ember 솔루션을 사용할 수 있을지 생각해보십시오. ember-power-select과 같은 꽤 멋진 addons가 있습니다.

하지만 당신은 정말 당신이 {{#link-to}} 만 <a> 태그를 생성하지만, 만에 클릭을 처리하고 다음 transitionTo을 수행하지 않는 것을 이해할 필요가 있음을 수행하려는 경우.

아니요, HTML에 DOM을 단순히 추가 할 때이 작업을 수행 할 수 없습니다. <a> 태그의 click 이벤트를 수동으로 파악한 다음 전환을 트리거해야합니다. DOM에 html을 삽입하는 방법에 따라 약간 다릅니다. 당신이 할 수

것은 각 <a> 태그의 고유 한 id를 만드는 것입니다 그리고 당신은 DOM에 HTML을 삽입 한 후에는 id으로 <a> 태그를 찾아 onclick 이벤트를 연결합니다.

더 좋은 방법은 HTML 대신 DOM을 만드는 것이므로 document.createElement을 수동으로 호출 한 다음 click 이벤트를 첨부하십시오.

당신이 (부품 등) 주입 소유자가 어떤 객체의 내부에 이런 일을 할 수있는 전환 트리거하려면 : 깨끗하게 그러나

Ember.getOwner(this).lookup('controller:application').transitionToRoute('stock-overview', 'en', 'tdwl', '1010'); 

을 최적의 솔루션이 타다 남은 핸들 템플릿 이동하는 것 및 {{#each}} 루프를 jQuery 솔루션 대신 사용하십시오. 그러나 어떻게해야하는지 알려주려면 더 많은 정보가 필요합니다. 그래서 가장 좋은 방법은 새로운 질문을하고 정확히 무엇을 달성하고 싶은지 설명하고, 다른 문제에 대한 잘못된 해결책을 가지고있는 문제에 대해 물어 보는 것입니다.