Angular PrimeNG 的 SelectButton 组件可以用于单选和多选，当设置为多选时，用户可以选择多个选项。以下是一个示例：

HTML 代码

TypeScript 代码

import { Component } from '@angular/core';

@Component({
    selector: 'my-app',
    template: `
        
SelectButton Demo
        
    `
})
export class AppComponent {
    cities: SelectItem[];
    selectedCities: string[];

    constructor() {
        this.cities = [
            { label: 'New York', value: 'ny' },
            { label: 'London', value: 'ldn' },
            { label: 'Paris', value: 'par' },
            { label: 'Madrid', value: 'mad' },
            { label: 'Barcelona', value: 'bar' },
        ];
        this.selectedCities = ['ny', 'ldn'];
    }
}

在上面的代码中，我们先定义了一个 cities 数组，其中包含了多个选项，每个选项由一个 label 和一个 value 组成。然后，通过在 标签上设置 [options] 属性将选项传递给了 SelectButton 组件。

我们还将 [(ngModel)] 绑定到了 selectedCities 属性，这将使得用户在选择选项时，选中的选项的值会自动保存在 selectedCities 数组中。

最后，通过设置 multiple="multiple" 将 SelectButton 设置为多选模式。

运行该示例，您会看到选择按钮组件，在单选模式下，每次单击一个选项，它都会变为选中状态。而在多选模式下，则可以选中多个选项，并且所选选项的值都将自动保存在 selectedCities 数组中。 免责声明：本文内容通过AI工具匹配关键字智能整合而成，仅供参考，火山引擎不对内容的真实、准确或完整作任何形式的承诺。如有任何问题或意见，您可以通过联系service@volcengine.com进行反馈，火山引擎收到您的反馈后将及时答复和处理。