ng-select未显示bindLabel值

Question

Ng-select未向客户端显示bindLabel值。也没有一个错误。我有几个ng-select下拉列表。一分之一下拉显示价值。但是，即使我在另一个div中使用相同的下拉菜单，也不会显示该值。

这是我一格的下拉列表：

     <div class="col-12 col-sm-12 col-md-4 m-auto mt-2">
<ng-select [items]="immigrationOptions" placeholder="Immigration Status" bindLabel="immigration_s_name"
bindValue="id" [ngClass]="{ 'is-invalid': submitted && f.immigration_status_id.errors }" appendTo="body" [virtualScroll]="true" formControlName="immigration_status_id"             [(ngModel)]="immigrationOption" aria-describedby="cnt_immigration_status_id">
     </ng-select>
    <small id="cnt_immigration_status_id" class="form-text text-muted">Immigration Status</small>
    <div *ngIf="submitted && f.immigration_status_id.errors" class="invalid-feedback">
   <div *ngIf="f.immigration_status_id.errors.required">Immigration status is required</div>
</div>
 </div>

我两次使用相同的下拉菜单。但是，它不在另一个div的第二个下拉列表中向用户显示标签

请同时检查“附加的屏幕截图”。

这在下拉菜单中没有显示任何值。 这显示下拉列表中的值：

Answer 1

我知道它可能看起来很奇怪，但是有时将name更改为title，反之亦然，对我来说很有效！ 尝试使用

bindLabel="immigration_s_title"

Answer 2

今天我也发生了同样的事情：

ng-select使用项数组通过如下所示的绑定显示选项：[items] ='itemArray'。这是用户首次填写表单时选择选项的方式（我们已经知道）。保存数据后，后端仅存储选定的项目。

当表单被重新使用以查看记录并可能再次编辑时，该相同项目数组不能为空。如果是，则不会显示所选的选项。 Angular不会发出任何警告，也不在乎。

Take Away：无论用户是第一次编辑，还是从数据存储中读取内容以进行查看和编辑，请确保items数组中包含内容。

Answer 3

这与变更检测有关： Ng-select 组件实现 OnPush 更改检测，这意味着脏检查检查不可变数据类型。这意味着如果您进行对象突变，例如：

this.items.push({id: 1, name: 'New item'})

组件不会检测到更改。相反，您需要这样做：

this.items = [...this.items, {id: 1, name: 'New item'}];

这将导致组件检测到更改和更新。有些人可能会担心这是一个代价高昂的操作，但是，它比运行 ngDoCheck 并不断地对数组进行差异化要高效得多。

您可以参考以下链接： https://www.npmjs.com/package/@ng-select/ng-select