问题描述
在表单上的编辑模式下,我试图在nz-autocmplete上设置默认值。但是,输入显示为[object Object]。仅当从nz-autocmplete下拉菜单中手动选择它时,它才能按预期工作。
我正在使用:
- 角度:9.1
- ng-zorro-antd:8.5.2
这是输入代码段:
<nz-form-item>
<nz-form-label nzRequired [nzSm]="10" [nzXs]="24" nzFor="mainClient">
<span class="intern-detail">Hlavny klient</span>
</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="userErrorTpl">
<nz-input-group [nzSuffix]="addNewClientButton">
<input formControlName="mainClient" nz-input [nzAutocomplete]="clientAutocomplete"/>
</nz-input-group>
</nz-form-control>
</nz-form-item>
这是自动完成代码段:
<nz-autocomplete #clientAutocomplete [compareWith]="compareFun">
<nz-auto-option *ngFor="let client of filteredClients" [nzValue]="client" [nzLabel]="client.name">
<p class="small-height bold">{{ client.name }}</p>
<p class="small-height tiny-font">{{ client.email }}</p>
<p class="small-height tiny-font">{{ client.phoneNumber1 }}</p>
</nz-auto-option>
</nz-autocomplete>
感谢您提供任何解决方法的想法。
解决方法
我遇到了同样的问题,问题的原因是我使用的是动态数据源。
由于我的动态数据源在初始化时为空,nz-autocomplete 没有什么可比较的,所以它返回 [Object,Object]
所以我必须做的是将作为控制字段值的数据编码为初始化时动态数据中的相同数据。
对您而言,这意味着 filteredClients
必须具有您为 mainClient
控制字段值设置的相同初始数据。