墊子自動完成不允許我 select

Question

我剛剛從這里https://v7.material.angular.io/components/autocomplete/examples復制了上面示例中的確切代碼

問題是當我 select 在列表中單擊它時，它沒有顯示在頂部的框中。 我希望它基於它在他們的示例中的工作方式。 當我單擊該元素時，它顯示單擊 animation 但實際上沒有選擇任何內容。

我在控制台中收到此錯誤。 mat-form-field 必須包含一個 MatFormFieldControl。

這是我的代碼。 我正在使用 angular v13

 import { Component, OnInit } from '@angular/core'; import {FormControl} from "@angular/forms"; @Component({ selector: 'app-autocomplete-display-example', templateUrl: './autocomplete-display-example.component.html', styleUrls: ['./autocomplete-display-example.component.css'] }) export class AutocompleteDisplayExampleComponent{ myControl = new FormControl(); options: string[] = ['One', 'Two', 'Three']; }

 <form class="example-form"> <mat-form-field class="example-full-width"> <input type="text" placeholder="Pick one" aria-label="Number" matInput [formControl]="myControl" [matAutocomplete]="auto"> <mat-autocomplete #auto="matAutocomplete"> <mat-option *ngFor="let option of options" [value]="option"> {{option}} </mat-option> </mat-autocomplete> </mat-form-field> </form>

Answer 1

我認為您需要從 angular 材料中導入： MatAutocompleteModule 和 MatInputModule 。 此外，您需要導入 ReactiveFormsModule