3

我已将我的应用程序从 Angular 5 迁移到 Angular 6。我还将 ng-select 版本更新为 2.4.2，这是来自 npm / GitHub 的最新版本。

升级后，下拉菜单坏了，我看不到下拉菜单的设计或样式。只是 UI 上 HTML 损坏的列表。

有谁知道如何修复它或哪个版本的 ng-select 可以与 Angular 6 一起使用？

由于那里的“labelForId”属性，我必须使用 ng-select 2+ 版本。

这就是 package.json 的样子。

"dependencies": {
    "@angular/animations": "^6.1.3",
    "@angular/common": "^6.1.3",
    "@angular/compiler": "^6.1.3",
    "@angular/core": "^6.1.3",
    "@angular/forms": "^6.1.3",
    "@angular/http": "^6.1.3",
    "@angular/platform-browser": "^6.1.3",
    "@angular/platform-browser-dynamic": "^6.1.3",
    "@angular/router": "^6.1.3",
    "@ng-bootstrap/ng-bootstrap": "^3.0.0",
    "@ng-select/ng-select": "2.4.2",

这就是它的外观。

在此处输入图像描述

有谁知道如何修理它？

奇怪的是它在 "@ng-select/ng-select": "^0.16.0",

4

1 回答 1

1

检查您是否在主应用程序组件（doc）中导入主题文件

@import "~@ng-select/ng-select/themes/default.theme.css";
// ... or 
@import "~@ng-select/ng-select/themes/material.theme.css";

编辑：你的html模板是ng-select这样的吗？（演示）

<ng-select [items]="items"
         bindLabel="name"
         bindValue="name"
         placeholder="Select city"
         [(ngModel)]="selectedCityName">
  <ng-template ng-option-tmp let-item="item" let-index="index">
      <img height="15" width="15" [src]="item.avatar"/>
      <b>{{item.name}}</b>
  </ng-template>
</ng-select>

如果不是，则模板已过时。您的代码不能从 ng-select 版本 2 或更高版本中使用。您必须更新新代码

于 2018-08-17T05:54:41.300 回答