【问题标题】:There is no directive with exportAs set to matAutocomplete没有将 exportAs 设置为 matAutocomplete 的指令
【发布时间】:2018-07-12 18:56:46
【问题描述】:

错误

没有将“exportAs”设置为“matAutocomplete”的指令 ("-label="Number" matInput [formControl]="myControl" [matAutocomplete]="auto">

我使用了https://material.angular.io/components/autocomplete/overview的代码

我还包含在 Angular app.module.ts 中的导入中:

import { 
         MdAutocompleteModule,

  } from '@angular/material';

Html 组件

<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>

ng--版本

@angular/cli: 1.2.1
node: 8.3.0
os: win32 x64
@angular/animation: 4.0.0-beta.8
@angular/animations: 4.3.3
@angular/cdk: 2.0.0-beta.8
@angular/common: 4.3.2
@angular/compiler: 4.3.2
@angular/core: 4.3.6
@angular/forms: 4.3.2
@angular/http: 4.3.2
@angular/material: 2.0.0-beta.8
@angular/platform-browser: 4.3.2
@angular/platform-browser-dynamic: 4.3.2
@angular/router: 4.3.2
@angular/cli: 1.2.1
@angular/compiler-cli: 4.4.3
@angular/language-service: 4.3.2

任何人都可以提出为什么 Angular 抱怨。

【问题讨论】:

  • 将您的角度和材质版本更新为 5+ ...您正在使用不支持 mat 前缀的 @angular/material: 2.0.0-beta.8。 angular material 的文档站点使用最新版本。如果您想继续使用相同的版本,请告诉我,我会发布特定版本的答案。
  • 我确实有一些问题。我已经在一个组件中启动并运行了自动完成功能,我想在另一个组件中使用它们,我把这些东西扔给我。你有没有发现是什么原因造成的?

标签: angular typescript angular-material angular-material2


【解决方案1】:

要使用mat-form-field,您必须将@angular/material@angular/cdk 版本至少更新为2.0.0-beta.12。使用以下命令进行更新:

npm install @angular/cdk@2.0.0-beta.12
npm install @angular/material@2.0.0-beta.12

然后,您已在 AppModule 中导入以下内容:

import { MatAutocompleteModule, MatFormFieldModule } from '@angular/material';

@NgModule({
    imports: [
        ....
        MatAutocompleteModule, 
        MatFormFieldModule,
        ....
    ],
    ....
})
export class AppModule { }

这是一个使用版本 2.0.0-beta.12

的工作 StackBlitz demo

【讨论】:

  • 就我而言,问题是我忘记在我的AppModule 中导入MatAutocompleteModule
猜你喜欢
  • 1970-01-01
  • 2018-08-05
  • 2019-06-19
  • 2017-10-02
  • 1970-01-01
  • 1970-01-01
  • 2017-10-21
相关资源
最近更新 更多