Javascript 如何使列表选择选项在mat选择列表中唯一？

我有一个用例，其中我需要在Angular2材料垫选择列表中进行唯一的列表选择

我经历过

https://github.com/angular/material2/blob/master/src/demo-app/list/list-demo.html

及

---

请帮帮我。

我正为同样的问题绞尽脑汁。 我的第一个方法是隐藏材质选择列表的复选框。 在（selectionChange）调用一个函数时，该函数取消了我的模式并将数据发送回其父级

select-dialog-component.html

<mat-selection-list>
  <mat-list-option *ngFor="let option of options" [value]="option.value" (selectionChange)="onSelectedOptionsChange(value)"> {{option.name}} </mat-list-option>
</mat-selection-list>

并且还添加到css中（正如我上面所评论的）

就这样。它起作用了。它看起来很酷，一切都很好，直到你意识到它有点滞后。然后你会发现，如果你多次切换模式，它就会开始滞后很多

---

因此，这里是我的第二种方法（看起来也更正确）。 不要使用垫子选择列表，而是使用垫子列表并将垫子按钮放在里面

选择-dialog-component-v2.html

<mat-list>
  <mat-list-item *ngFor="let option of options" (click)="onSelectedOptionsChange(option.value)">
    <button mat-button> {{option.name}} </button></mat-list-item>
</mat-list>

{{option.name}

希望有帮助

.mat-pseudo-checkbox {display: none;}

<mat-list>
  <mat-list-item *ngFor="let option of options" (click)="onSelectedOptionsChange(option.value)">
    <button mat-button> {{option.name}} </button></mat-list-item>
</mat-list>