Я делала без инпутов и меняла иконки, в зависимости от того, выбран ли option.
Наверное с атрибутами инпутов так тоже можно.
В методе choice проверяем data.selected и в зависимости от результата устанваливаем класс или атрибут
callbackOnCreateTemplates: function(template) {
return {
item: ({ classNames }, data) => {
return template(`
<div class="${classNames.item} ${
data.highlighted
? classNames.highlightedState
: classNames.itemSelectable
} ${
data.placeholder ? classNames.placeholder : ''
}" data-item data-id="${data.id}" data-value="${data.value}" ${
data.active ? 'aria-selected="true"' : ''
} ${data.disabled ? 'aria-disabled="true"' : ''}>
${data.label}
<button type="button" class="choices__button" aria-label="Удалить марку: ${data.label}" data-button="">Удалить марку</button>
</div>
`);
},
choice: ({ classNames }, data) => {
var icon = (data.selected) ? 'checked' : 'unchecked';
return template(`
<div class="${classNames.item} ${classNames.itemChoice} ${
data.disabled ? classNames.itemDisabled : classNames.itemSelectable
}" data-select-text="${this.config.itemSelectText}" data-choice ${
data.disabled
? 'data-choice-disabled aria-disabled="true"'
: 'data-choice-selectable'
} data-id="${data.id}" data-value="${data.value}" ${
data.groupId > 0 ? 'role="treeitem"' : 'role="option"'
}>
<i class="flaticon-${icon}"></i>
${data.label}
<span>${data.customProperties.num}</span>
</div>
`);
},
};
},
