我正在使用Angular Material 6.4.7,但是Mat-Autocomplete遇到了一些麻烦。 我在MatDialog中插入了自动完成功能,对话框中隐藏了自动完成功能的下拉菜单。我知道我可以将z-index设置为较高的值,但这并不是真正的解决办法,因此我尝试使用指令#origin =“ matAutocompleteOrigin”和[matAutocompleteConnectedTo] =“ origin”。作为标题,它给了我错误“没有将指令“ exportAs”设置为autoCompleteoOrigin“。 我的package.json:
"@angular/animations": "^6.1.8",
"@angular/cdk": "^6.4.7",
"@angular/common": "^6.1.8",
"@angular/compiler": "^6.1.8",
"@angular/core": "^6.1.8",
"@angular/forms": "^6.1.8",
"@angular/http": "^6.1.8",
"@angular/material": "^6.4.7",
"@angular/platform-browser": "^6.1.8",
"@angular/platform-browser-dynamic": "^6.1.8"
我的html:
<div #origin="matAutocompleteOrigin">
<form>
<mat-form-field>
<input matInput type="text" placeholder="Search icon..." [matAutocomplete]="auto" [formControl]="iconCtrl"
[matAutocompleteConnectedTo]="origin">
<mat-autocomplete #auto="matAutocomplete">
<mat-option *ngFor="let li of filteredIcons | async" [value]="li" (onSelectionChange)="onSelectIcon($event)">
<i [ngClass]="['selected-icon-class', li]"><span class="icon-text"> {{li}} </span></i>
</mat-option>
</mat-autocomplete>
</mat-form-field>
</form>
</div>
有什么建议吗?
答案 0 :(得分:0)
您在DIV上省略了matAutocompleteOrigin
指令:
<div matAutocompleteOrigin #origin="matAutocompleteOrigin">
'exportAs matAutocompleteOrigin'属于该指令,因此#origin="matAutocompleteOrigin"
失败。