[]
MultiSelect 컨트롤은 데이터 멤버가 있어야 항목 선택 여부를 확인할 수 있습니다. 하나가 제공되지 않으면 컨트롤은 데이터 항목에 '$checked' 속성을 추가합니다.
다음과 같은 두 가지 속성이 있는 객체를 포함하는 전용 itemsSource를 만들어 이러한 문제를 방지할 수 있습니다: original item과 checked member.
예시: original item과 checked member를 사용하여 MultiSelect 컨트롤을 만듭니다:
<div id="theMultiSelect"></div>
Checked Items:
<p id="checkedItems"></p>
import * as input from '@mescius/wijmo.input';
import { getData } from './data';
function init() {
var theMultiSelect = new input.MultiSelect('#theMultiSelect', {
placeholder: 'Devices',
displayMemberPath: 'item.name',
checkedMemberPath: 'checked',
itemsSource: getCheckableData(),
checkedItemsChanged: (sender) => {
let checkedItems = sender.checkedItems.map(checkableItem => checkableItem.item);
document.querySelector('#checkedItems').textContent = checkedItems.length ? JSON.stringify(checkedItems) : '';
}
});
// create a data source with items and an extra checkable member
function getCheckableData() {
return getData().map(item => ({ item: item, checked: false }));
}
}