Предметы PrimeNG Menubar даже не - PullRequest
0 голосов
/ 06 ноября 2018

Я добавил минимальный экземпляр PrimeNG Menubar в приложение, над которым я работаю. Но когда приложение рендерится, элементы меню (их всего два) неравномерны; элементы отображаются в порядке, но первый элемент ниже, чем второй.

Соответствующий код следует:

Угловая составляющая:

import { Component, OnInit } from '@angular/core';
import { MenuItem } from 'primeng/api';

@Component({
  selector: 'app-menubar',
  templateUrl: './menubar.component.html',
  styleUrls: ['./menubar.component.css']
})
export class MenubarComponent implements OnInit {
  CORE_MENU_ITEMS: MenuItem[] = [
    {
      label: 'Home',
      icon: 'fa fa-home',
      routerLink: ['/home'],
    },
    {
      label: 'Comics',
      icon: 'fa fa-book',
      items: [
        {
          label: 'Library',
          icon: 'fas fa-book-reader',
          routerLink: ['/comics'],
        },
        {
          label: 'Import',
          icon: 'fas fa-file-upload',
          routerLink: ['/import'],
        },
      ]
    }
  ];

  protected items: MenuItem[];

  constructor() { }

  ngOnInit() {
    this.items = this.CORE_MENU_ITEMS;
  }
}

Компонент HTML:

<p-menubar styleClass='border-0' [model]='items' [autoDisplay]='false'>
</p-menubar>

В .angular-cli.json я добавил:

"prefix": "app",
    "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.css",
    "../node_modules/primeng/resources/primeng.min.css",
    "../node_modules/primeng/resources/themes/start/theme.css",
    "../node_modules/@fortawesome/fontawesome-free/css/all.min.css",
    "styles.scss"
],

А вот скриншот: enter image description here

...