Angular 如何选择性地在角度视图中添加材质“自动完成”

我希望能够选择性地将自动完成添加到输入

目前，我已尝试将

*ngIf

添加到mat autocomplete标记，但它会引发错误，因为输入具有

matAutocomplete

属性，并且正在查找autocomplete组件。当我想关闭自动完成功能时，我还尝试将

matAutocomplete

设置为null，但这不起作用

以下是我所累的：

但我得到：

Error: Attempting to open an undefined instance of `mat-autocomplete`.

这就是我希望它工作的方式：

---

但是不必复制输入和表单字段标记。

只要稍加修改，您就可以在检查幻灯片时用空数组替换建议：

<mat-autocomplete  #auto="matAutocomplete">
      <mat-option *ngFor="let state of (slide.checked ? [] : (filteredStates| async)) " 
[value]="state.name">
...

...

如果您总是有自动完成组件，但有时没有用于该组件的项目，那么建议的“hack”非常有效。但听起来您想基于MatFormField和MatInput创建一个自定义组件，可以选择使用MatAutocomplete。我已经这样做了，除非您使用Angular Material v6的未来版本，否则在表单字段上没有办法绕过ngIf。见（我的问题）。他们将通过一个新的指令选项在Angular Material v6中修复此问题，以禁用自动完成-

matAutocompleteDisabled

。发布后，您可以执行以下操作：

<input matInput [matAutocomplete]="auto" [matAutocompletDisabled]="slide.checked">

---

因此，如果

auto

为空，则不会出现任何错误。

hmmmm。文档称该属性名为[autocompleteDisabled]。它不起作用。我也尝试过[matAutocompleteDisabled]，但它仍然不起作用。显然，从6.0开始，它还没有实现。2@Curtis-是的-正如我所说，未来版本-他们将修复此问题。如果您查看此问题，您将看到修复程序尚未合并到master。从v9.x开始，效果非常好[matAutocompleteDisabled]=“！（dataSvc.profile$| async）。userProfileSettings.showCompanyLookup”