Angular Небулярные стили не применяются для NbChatComponent - PullRequest
Новая
       50

Angular Небулярные стили не применяются для NbChatComponent

2 голосов
/ 08 апреля 2020

У меня есть текущий проект angular, и я пытаюсь добавить в проект пользовательский интерфейс Nebular Chat.

Я установил nebular с npm и выполнил импорт, как упомянуто на сайте. Функциональность работает должным образом, но стили не применяются к компоненту.

Ниже приведены шаги, которым я следовал.

  1. npm install --save @ nebular / theme @ angular / cdk @ angular / animations
  2. npm install --save @ nebular / eva-icons

  3. Импортированы NbThemeModule и NbChatModule в app.module.ts 

    import { NbThemeModule, NbChatModule } from '@nebular/theme';

@NgModule({
imports: [
  ...
  NbThemeModule.forRoot(),
  NbChatModule
]

  4. Добавлены стили в angular. json

    "styles": [
      "node_modules/@nebular/theme/styles/prebuilt/default.css"

  5. Добавлен html компонент (образец доступен на сайте) 

    <nb-chat title="Nebular Conversational UI">
    <nb-chat-message *ngFor="let msg of messages"
                     [type]="msg.type"
                     [message]="msg.text"
                     [reply]="msg.reply"
                     [sender]="msg.user.name"
                     [date]="msg.date"
                     [files]="msg.files"
                     [quote]="msg.quote"
                     [latitude]="msg.latitude"
                     [longitude]="msg.longitude"
                     [avatar]="msg.user.avatar">
</nb-chat-message>

<nb-chat-form (send)="sendMessage($event)" [dropFiles]="true">
</nb-chat-form>

Выход 1

enter image description here

Ссылки:

https://akveo.github.io/nebular/docs/guides/install-nebular#manually https://akveo.github.io/nebular/docs/components/chat-ui/overview#nbchatcomponent

1 Ответ

0 голосов
/ 24 апреля 2020

Я пытался загрузить миксины и вручную включить глобальные CSS в основной файл styles.scss, но получил тот же результат. Мой проект для codesandbox здесь . Ребята из @nebular, помогите нам, пожалуйста!

...