如何在mat-chip中添加水平滚动条

在mat-chip中添加水平滚动条可以通过以下步骤实现：

1. 首先，确保你已经安装了Angular Material库，并在你的项目中导入了MatChipsModule模块。
2. 在你的HTML模板中，使用mat-chip-list元素包裹mat-chip元素，创建一个chip列表。例如：

<mat-chip-list>
  <mat-chip *ngFor="let chip of chips">{{ chip }}</mat-chip>
</mat-chip-list>

1. 在你的CSS样式文件中，为mat-chip-list元素添加以下样式：

.mat-chip-list {
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
}

这些样式将使chip列表水平滚动，并且不换行显示。

1. 在你的组件中，定义一个chips数组，并在ngOnInit()方法中初始化它：

chips: string[] = ['Chip 1', 'Chip 2', 'Chip 3', 'Chip 4', 'Chip 5', 'Chip 6', 'Chip 7', 'Chip 8', 'Chip 9', 'Chip 10'];

1. 最后，你可以根据需要自定义chips数组的内容，并在mat-chip-list中显示它们。当chip的数量超过容器的宽度时，将会出现水平滚动条。

这是一个基本的示例，你可以根据自己的需求进行进一步的样式和功能定制。关于Angular Material的更多信息和使用方法，你可以参考腾讯云的Angular Material文档：Angular Material。