Применение javascript к сгенерированному контенту

Будучи новичком в Meteor, я столкнулся с проблемой, с которой столкнулся при создании ввода «на лету» с помощью помощника. Действительно, то, что я пытаюсь сделать, это сгенерировать левый помеченный ввод с раскрывающимся списком, но проблема в том, что мне нужно вызвать метод $('.ui.dropdown').dropdown();

После создания каждого ввода с соответствующим раскрывающимся списком, и я не знаю, как это сделать правильно с помощью семантического пользовательского интерфейса и среды Meteor. Вот мой помощник, создающий входные данные:

'filterColumns': function() {
        return Session.get('s_filterColumns');
    }

Где 's_filterColumns' - это массив вида ["Firstname", "Lastname", "LivingPlace"]

А вот HTML-шаблон, использующий помощник для генерации входных данных:

<div id="fields">
        <div class="ui grid">
            {{#each filterColumns}}
                <div class="eight wide column">
                    <label>{{this}}</label>
                    <div class="ui left labeled input">
                        <div class="ui dropdown label">
                            <div class="text">Start by</div>
                            <i class="dropdown icon"></i>
                            <div class="menu">
                                <div class="item">Start by</div>
                                <div class="item">Contains</div>
                                <div class="item">End by</div>
                            </div>
                        </div>
                        <input type="text">
                    </div>
                </div>
            {{/each}}
        </div>
    </div>

Но затем при заполнении переменной сеанса новым содержимым входные данные создаются соответствующим образом, но метод раскрывающегося списка javascript больше не вызывается, поэтому моя левая метка не является раскрывающимся списком.

Если у вас есть какие-либо рекомендации относительно чего-либо в моей концепции, я был бы рад узнать от кого-то более опытного, чем я.


person Timon. Z    schedule 23.08.2015    source источник
comment
Не совсем понятно, в чем вопрос. Вы спрашиваете, когда вы можете позвонить $('.ui.dropdown').dropdown();? Если это так, попробуйте запустить его внутри Template.myTemplate.onRendered(), где myTemplate — это название вашего шаблона. Учитывая, что у вас есть несколько раскрывающихся списков, вы можете поместить html, который находится внутри вашего {{#each }}, в свой собственный шаблон и использовать его для onRendered().   -  person Michel Floyd    schedule 23.08.2015
comment
ты проверил? stackoverflow.com/questions/11022131 /   -  person Da Rod    schedule 23.08.2015
comment
Мишель, спасибо за идею, я поместил свой HTML в собственный шаблон и использовал onRendered() для вызова метода dropdown() для нового ввода. Работает отлично и именно то, что я хотел.   -  person Timon. Z    schedule 23.08.2015


Ответы (1)


Если вы не знаете, когда вызывать $('.ui.dropdown').dropdown(), попробуйте запустить его внутри Template.myTemplate.onRendered(), где myTemplate — имя вашего шаблона. Учитывая, что у вас есть несколько раскрывающихся списков, вы можете поместить html, который находится внутри вашего {{#each }}, в свой собственный шаблон и использовать его для onRendered().

Примечание. Вики-ответ сообщества создан, поскольку на вопрос ответил Мичел Флойд в комментариях.

person Community    schedule 25.08.2015