如何在角形材料选择表单组件中添加搜索功能?

Avd*_*hut 1 html typescript angular angular-material-6

mat-select从有角材料下拉菜单。
它具有来自API的状态列表。在下拉菜单中有10多个选项。

去做 :

  • 我想从.stackblitz 中mat-select使用。中的“ 搜索”选项,mat-select search但这确实很难理解。

请给我建议简单的方法。

我的JSON代码

"{
  "data": [
    {
      "id": 32,
      "name": "Andaman And Nicobar Islands"
    },
    {
      "id": 16,
      "name": "Odisha"
    },
    {
      "id": 34,
      "name": "Puducherry"
    },
    {
      "id": 19,
      "name": "Uttar Pradesh"
    },
    {
      "id": 5,
      "name": "Uttarakhand"
    },
    {
      "id": 6,
      "name": "Andhra Pradesh"
    }
  ],
  "statusCode": 200
}"
Run Code Online (Sandbox Code Playgroud)

Seb*_*ian 6

<mat-select-search [formControl]="formControlName"></mat-select-search>
Run Code Online (Sandbox Code Playgroud)

将此标签添加到mat-select内,并按照StackBlitz的app.component.ts中的步骤进行操作