Octobercms Компонент Twig

Question

Может ли кто-нибудь показать мне, как установить уникальный идентификатор для компонентов? Я только знаю, что я должен поставить этот код в моем default.htm

{% set uid = '{{__SELF__.id}}' %} 

, как использовать его в JavaScript?

и что это?

var avatar_{{uid}} = {{ avatar }}; 

, например, это мой JS

$(function(){ 
    $("#tab-close").click(function() {   
     $("#tab").addClass("hidden"); 
    }); 
}); 

Как установить уникальный идентификатор для него, так что, когда я дублировать компонент как все еще может нормально работать без ошибок?

Answer 1

Это может быть лучше инкапсулировать управления с одним идентификатором, как этот

<div id="mycontrol{{ __SELF__.id }}"> 
    ... 
</div> 

Тогда в JavaScript можно ориентировать элементы внутри:

function initTabs(controlEl) { 
    var $control = $(controlEl) 
    $(".tab-close", $control).click(function() {   
     $(".tab", $control).addClass("hidden"); 
    }); 
} 

Код выше цели имена классов найденный только внутри контейнера $control. Вы бы назвали эту функцию такой разметкой

<script> 
    $(function(){ 
     initTabs('#mycontrol{{ __SELF__.id }}'); 
    }); 
</script>