未找到名称“matAutocomplete”的导出

Question

我无法理解我的代码出了什么问题，我导入了模块，但仍然收到此错误“未找到名称'matAutocomplete'导出”

注意：导入MatAutocompleteModule后，我重新启动IDE再次编译几次，还是一样。

这里是 app.module.ts - 仅粘贴代码的相关部分

import {MatAutocompleteModule} from '@angular/material/autocomplete';
@NgModule({ declarations:[..xxxx....],
imports:[xx,xxx,MatAutocompleteModule],
providers:[xx,xx],
bootstrap: [AppComponent]})
export class AppModule { }

组件.html

<form class="form-group-parent p-0" [formGroup]="frmStep1" (ngSubmit)="submit()">
       <mat-form-field class="example-full-width">
          <input type="text" placeholder="Ex. English" aria-label="Language" matInput
                    [formControl]="language" [matAutocomplete]="auto">
               <mat-autocomplete autoActiveFirstOption #auto="matAutocomplete">
                  <mat-option *ngFor="let option of languageList | async" [value]="option">
                        {{option}}
                  </mat-option>
                  </mat-autocomplete>
                 <mat-error>
                    <strong>Language</strong> is required.
                </mat-error>
       </mat-form-field>
</form>

组件.ts

import {Component, OnInit} from '@angular/core';
import {FormControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import {Observable} from 'rxjs';
import {map, startWith} from 'rxjs/operators';

@Component({
  selector: 'xxxx',
  templateUrl: './cxx.component.html',
  styleUrls: ['./xxx.component.scss']
})

export class xxxComponent implements OnInit {

constructor(
 private pageTitle: Title,
 private router: Router,
 private fb: FormBuilder,
 private http: HttpClient,
) { this.createForm(); }

frm1:FormGroup;
frm2:FormGroup;
languageList: Array<any> = ['A','B','C','D','E']
filteredOptions: Observable<string[]>;

ngOnInit():void{
 this.filteredOptions = this.frmStep2.valueChanges.pipe(
  startWith(''),
  map(value => this._filter(value))
);

}

createForm(): object {
  this.frmStep1 = this.fb.group({
 language:[,[Validators.required]]
});
return frmStep1 :this.frmStep1 
}

}

Answer 1

嗯，我需要在特定规范文件的“声明”下添加“MatAutoComplete”。 就你而言，我想它应该在“component.spec.ts”中。

我就是这样做的

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [ ... , MatAutocomplete ],
      providers: [ ... ],
    })
    .compileComponents();
  });

Answer 2

我也有同样的问题。您可以重建您的应用程序。

Answer 3

经过几个小时的搜索和尝试多种方法（包括推荐的方法）后，我只找到了使用以下方法的解决方案：

@Directive({
    selector: 'mat-autocomplete',
    exportAs: 'matAutocomplete'
})
class DirectiveStub {}

在其声明中的导入区域正下方定义“DirectiveStub”。