How to select or unselect chip items in the Syncfusion JavaScript Chips component.

The chip items can be selected or unselected by using the direct property or method of the JavaScript Chip component.

Step 1: Implement the Chip component by following the Getting Started page.

Step 2: To select chip items using the property, set chip ID values within the selectedChips property. Multiple chip selection can be enabled by setting the selection property to Multiple.

Step 3: To achieve chip item selection or un-selection using the method, pass a single or array of elements in the select method.

Refer to the below code snippet, where the chip items 1 and 3 will get selected through property.

let chip = new ChipList({
 chips: chipsData.filterData,
 selection: 'Multiple',
 selectedChips: [1, 3],
});
chip.appendTo('#chip-filter');

document.getElementById('btn1').addEventListener('click', () => {
 chip.select([1, 3]);
});

Sample: https://stackblitz.com/edit/nb7puu-k7rnjm?file=index.ts