Autocomplete 使用反应式表单时nz自动完成上的默认值

Autocomplete 使用反应式表单时nz自动完成上的默认值,autocomplete,ng-zorro-antd,Autocomplete,Ng Zorro Antd,当我的表单处于编辑模式时,我试图在nz autocomplete上设置默认值。但是,输入显示为[object]。仅当您从nz AutoComplete下拉列表中手动选择时,它才能按预期工作 我正在使用: 角度:9.1 ng佐罗antd:8.5.2 这是输入代码片段: <nz-form-item> <nz-form-label nzRequired [nzSm]="10" [nzXs]="24" nzFor="mainCli

当我的表单处于编辑模式时,我试图在nz autocomplete上设置默认值。但是,输入显示为[object]。仅当您从nz AutoComplete下拉列表中手动选择时,它才能按预期工作

我正在使用:

  • 角度:9.1
  • ng佐罗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-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>

{{client.name}

{{client.email}

{{client.phoneNumber1}


感谢您提出的任何解决方法。

我也遇到了同样的问题,问题的原因是我使用的是动态数据源

由于我的动态数据源在初始化时是空的,所以自动完成没有可比较的内容,因此它返回
[Object,Object]

因此,我要做的是将我作为控制字段值输入的数据编码为初始化时动态数据中的相同数据

对于您来说,这意味着
filteredClients
必须具有与您为
mainClient
控制字段值设置的相同的初始数据