如何避免使用 PrimeNG Dropdown 为多选下拉菜单选择项目？

Question

我有三个下拉菜单，每个下拉菜单都相互关联，三个下拉菜单中的任何一个都不应该有任何选定的值。

例如 我有三个下拉菜单，例如 Stock 1、Stock 2、Stock 3。 如果我为 Stock 1 选择了一个值，那么该值将无法从 Stock 2 和 Stock 3 中选择。

我想在 Angular 中使用 PrimeNG Dropdown 来实现上述功能。

Answer 1

在html中

<p-dropdown [options]="stockDropdown1" [(ngModel)]="selectedStock1" (onChange)="stock1ChangeHandler()"></p-dropdown>
<p-dropdown [options]="stockDropdown2" [(ngModel)]="selectedStock2" (onChange)="stock2ChangeHandler()"></p-dropdown>

在ts中：

completeStockDropdown = [{label:'choice1', value:foo}, {label:'choice2', value:bar}];
stockDropdown1 = this.completeStockDropdown;
stockDropdown2 = this.completeStockDropdown;

stock1ChangeHandler() {
    this.stockDropdown2 = this.completeStockDropdown.filter(option => option.value!=this.selectedStock1);
}