Выпадающий в нокауте варианты отображения

Question

Я всегда использовал Выбранный выпуск урожая который требует, чтобы какой -то JS был вызван на <select> вещь. Теперь я рендерирую свои списки выбора с нокаутом.

Это код, используемый для преобразования стандартного выпадения в выбранном выпадении

$(dropdownSelectorOrElement).Chosen()

мне нужно знать когда Нокаут закончил рендеринг <select>, чтобы вызвать код выше: возможно, функция обратного вызова должна ссылаться на <select> Сам, чтобы я мог пройти без использования селекторов.

Нокаут обнажает optionsAfterRender обратный вызов (задокументирован здесь: См. «Примечание 2») Однако:

• optionsAfterRender называется каждый раз, когда выводится вариант

• optionsAfterRender предоставляет только ссылку на элемент опциона

Мне нужно что -то вроде optionsAfterRender но позвонил только тогда, когда все <select> закончил рендеринг. У нокаута есть что -то подобное?

Я приготовил jsfiddle который иллюстрирует optionsAfterRender.

Answer 1

Я решил с этим пользовательским привязкой, найденной на этот вопрос.

ko.bindingHandlers.chosen = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {

        $(element).chosen();
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var value = ko.unwrap(valueAccessor()); // - see comment
        $(element).trigger("liszt:updated");
    }
};

Обратите внимание, что если вы не используете ko.unwrap, функция обновления не будет стрелять, как мне сказали в это Вопрос, связанный с этим вопросом.

Answer 2

Может также создать привязку к последствию:

ko.bindingHandlers.afterRender = {
    update: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
        allBindings.get('afterRender').call(viewModel, element);
    }
};

С этой точки зрения:

<select data-bind="
options: Options,
value: selection,
optionsText: 'text',
optionsValue: 'value',
afterRender: renderCallback
"></select>
<span data-bind="text: selection"></span>

И эта модель представления:

function viewModel() {

    this.renderCallback = function (selectElement) {
        console.log('call');
    };

    this.Options = [{
        text: "abee",
        value: "123"
    } ...
};

Смотрите скрипку

Я надеюсь, что это помогает.