selectedOptions: string[] = []; onSelect(option: string) { if (!this.selectedOptions.includes(option)) { this.selectedOptions.push(option); } } removeOption(option: string) { const index = this.selectedOptions.indexOf(option); if (index > -1) { this.selectedOptions.splice(index, 1); } } <select (change)="onSelect($event.target.value)"> <option value="" disabled selected>Select an option</option> <option value="Option 1">Option 1</option> <option value="Option 2">Option 2</option> <option value="Option 3">Option 3</option> </select> <ul> <li *ngFor="let option of selectedOptions"> {{ option }} <button (click)="removeOption(option)">Remove</button> </li> </ul>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter