Генерация идентификаторов в циклах Knockout Foreach

Question

Я пытаюсь создать HTML-код с Knockout, чтобы пользовательский интерфейс Jquery мог превращаться в кнопки переключения .Мне нужно прийти к следующему:

<div id="status">
    <input type="radio" id="status_ACTIVE" value="ACTIVE" name="status" /><label for="status_ACTIVE">Active</label>
    <input type="radio" id="status_INACTIVE" value="INACTIVE" name="status" checked="checked" /><label for="status_INACTIVE">Inactive</label>
</div>

Используя пользовательский интерфейс JQuery, я могу легко превратить это в кнопки переключения.Но как мне это сгенерировать, не используя устаревшие шаблоны JQuery?Вот что я пытался сделать:

Внутри модели javascript:

self.statuses = [{Selected:true,Text:"Active",Value:"ACTIVE"},{Selected:false,Text:"Inactive",Value:"INACTIVE"}];

Разметка:

<div id="status" data-bind="foreach: statuses">
    <input type="radio" name="status" data-bind="value: Value, id: 'status_' + Value" /><label data-bind="text: Text, for: 'status_' + Value"></label>
</div>

Это не работает.Я не думаю, что ему нравится, как я пытаюсь создать этот идентификатор или связать его с циклом for.Он рисует кнопки неправильно, так как две независимые кнопки и функция щелчка не работают.

Даже если я просто укажу значение в качестве идентификатора: id: Value и for: Value, оно все равно не будет работать,Могу ли я установить эти атрибуты с помощью нокаута?

Answer 1

Добавление этого javascript решило мою проблему:

ko.bindingHandlers.id = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).attr('id', valueAccessor());
    }
};

ko.bindingHandlers.forattr = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).attr('for', valueAccessor());
    }
};

Мне пришлось изменить for: 'status_' + Value на foratt: 'status_' + Value, поскольку for - зарезервированное слово.

Обновление: Я мог бы также использовать привязку "attr", например:

attr: { for: 'status_' + Value }