时间戳

首页 > 解决方案 > 多个字段的自动完成在所有字段中显示相同的选项

angular - 多个字段的自动完成在所有字段中显示相同的选项

问题描述

我是角度的新手，正在尝试使用角度材料。具体来说，我使用autocomplete的是角材料形式的特征。

我需要有两个带有搜索选项的输入下拉字段。我遵循了官方网站上给出的示例，但它仅适用于单个字段。如果我有 2 个字段，我会在这两个字段中获得相同的选项。这是我的代码的链接：

链接到我的代码

如果有人可以看看它并让我知道我哪里出错了，那就太好了。

提前致谢。

标签： angularangular-material

解决方案

这是因为您引用auto了两次。更改其中一个，例如，noticeauto1

<mat-form-field class="example-full-width">
    <input type="text" placeholder="Pick name" aria-label="Name" matInput [formControl]="namesControl" [matAutocomplete]="auto1">
    <mat-autocomplete #auto1="matAutocomplete">
        <mat-option *ngFor="let option of filteredNames | async" [value]="option">
            {{option}}
        </mat-option>
    </mat-autocomplete>
</mat-form-field>

这是你的stackblitz的一个分支

推荐阅读