DropdownModule无法按预期呈现

Question

我使用DropdownModule创建了一个下拉列表。下拉列表呈现但不如预期，如下所示：

打字稿

export const countryListOfObjects: SelectItem[]
    = [
  { label: 'Select a country', value: null },
  //A
  { label: 'Albania', value: { name: 'Albania', code: '' } },
  { label: 'Algeria', value: { name: 'Algeria', code: '' } },
  {
    label: 'American Samoa', value: { name: 'American Samoa', code: '' }
...]

HTML

  <p-dropdown [options] = 'countries'
                            [(ngModel)] = 'address.country'
                            formControlName = 'country'
                            [filter] = 'true'
                            ></p-dropdown>

删除过滤器绑定会产生相同的显示。

我正在使用angular2-final和当前发布的primeng。除了以下

之外，没有看到与primeng相关的错误

client？93b6：76 [默认] Z：\ node_modules \ primeng \ components \ fileupload \ fileupload.d.ts：2：9 模块＆＃39;＆＃34; J：/ workspace / angular2 / ts / epimss / node_modules / @ angular / platform-b​​rowser / index＆＃34;＆＃39;没有导出的成员＆＃39; DomSanitizer＆＃39;。

由于

Answer 1

这只是一个CSS问题。

你需要使用一堆css表，特别是primeng和字体很棒。

这就是我的angular-cli.json的样子

"styles": [
        "styles.css",
        "../node_modules/primeng/resources/themes/omega/theme.css",
        "../node_modules/primeng/resources/primeng.css",
        "../node_modules/font-awesome/css/font-awesome.min.css"
      ]

我在尝试导入primeng.css时遇到了问题，它抱怨loading.gif。所以我评论了css中的那条线。

如果您没有使用angular cli，则可以在index.html中导入它们。

编辑：如果你使用的是bootstrap css，它会搞乱primeng的下拉列表。