Question

可以将“角度材质按钮切换组”设置为multiple，然后可以从0到该组中的所有按钮进行选择。有没有一种方法可以强制至少必须选择一个按钮，并且还要设置所选按钮的最大值（如果限制为2，并且用户选择了第三个按钮，则第一个选择的按钮应更改为未选择）。可以通过mat-button-toggle-group来实现吗？

Answer 1

您必须使用组的“值”属性。在change方法中，使用参考变量传递整个“组”。

例如

    <mat-button-toggle-group #group="matButtonToggleGroup" 
                   multiple=true (change)="change(group)">
      <mat-button-toggle *ngFor="let value of [1,2,3,4,5]" [value]="value">
        <mat-icon>format_align_left</mat-icon>
      </mat-button-toggle>
    </mat-button-toggle-group>
    <div class="example-selected-value">Selected value: {{group.value}}</div>

  max:number=2;
  change(group:any)
  {
     //group.value is an array with the elements selected
     if (group.value.length>this.max)
     {
        let newValue=group.value;
        newValue.shift();
        group.value=newValue;     
     }
  }

请参见stackblitz

限制“角度按钮切换”组中的可选按钮

1 个答案: