複数選択：チェック状態

MultiSelectコントロールには、項目が選択されているかどうかを判断するためのデータメンバが必要です。そのようなデータメンバが提供されていない場合、コントロールはデータ項目に'$checked'プロパティを追加します。

これを避けるには、2つのプロパティ（元の項目とcheckedメンバ）から成るオブジェクトを保持する専用のitemsSourceを作成します。

例：元の項目とcheckedメンバを使用したMultiSelectコントロールを作成します。

HTML

<div id="theMultiSelect"></div>

チェックされた項目:
<p id="checkedItems"></p>

JavaScript

import * as input from '@mescius/wijmo.input';
import { getData } from './data';

function init() {
    var theMultiSelect = new input.MultiSelect('#theMultiSelect', {
        placeholder: 'デバイスを選択',
        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) : '';
        }
    });

    // 項目と追加のcheckedメンバから成るデータソースを作成します
    function getCheckableData() {
        return getData().map(item => ({ item: item, checked: false }));
    }
}