angular material 自动完成模板中的 tslint 错误

Question

在 angular 4 应用程序上，我使用 material 组件 autocomplete，与文档中给出的示例：

<md-form-field>
   <input type="text" mdInput [formControl]="myControl"  [mdAutocomplete]="auto">
</md-form-field>

<md-autocomplete #auto="mdAutocomplete">
   <md-option *ngFor="let option of options" [value]="option">
      {{ option }}
   </md-option>
</md-autocomplete>

我也使用 tslint，但由于语法 [mdAutocomplete]="auto":

，我的模板文件出现错误

The property "auto" that you're trying to access does not exist in the class declaration.

如何避免这个错误？

Answer 1

这是一个解码器问题。看到这个 link and this issue：

Problem exist in codelyzer 3.0.1 ( vs tslint@^5.0.0), however, is fixed in codelyzer3.0.0-beta.1 (vs tslint@^4.0.0).

作为解决方法，在您的打字稿 class 中使用 @ViewChild。

import { ViewChild, ElementRef } from '@angular/core';
// ....

// Get the 'auto' element in your component class
@ViewChild('auto') auto: ElementRef;

angular material 自动完成模板中的 tslint 错误

tslint error in template with angular material autocomplete

angular-material

angular-material2

angular