Использование потрясающих шрифтов иконок в angular 6 внутри index.html - PullRequest
Новая
       74

Использование потрясающих шрифтов иконок в angular 6 внутри index.html

0 голосов
/ 25 мая 2018

Я успешно добавил загрузчик в мой проект andular 6, который будет показывать загрузчик при начальной загрузке до полной загрузки приложения.Я, однако, не могу получить потрясающий значок шрифта для загрузки внутри счетчика.

app.module.ts 

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { fab } from '@fortawesome/free-brands-svg-icons';

import { AppComponent } from './app.component';

library.add(fab);

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FontAwesomeModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

src / index.html

<body>
  <abe-root>

    <div class="app-loading">
      <div class="logo"><fa-icon [icon]="['fab', 'angular']"></fa-icon></div>
      <svg class="spinner" viewBox="25 25 50 50">
        <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>
      </svg>
    </div>

  </abe-root>
</body>

Это не ошибка или что-то, что просто не показывает значок?Я довольно новичок в angular, поэтому могу делать что-то совершенно не так.

1 Ответ

0 голосов
/ 26 мая 2018

Это не будет работать 

  <div class="logo"><fa-icon [icon]="['fab', 'angular']"></fa-icon></div>

, поскольку контекст приложения пока отсутствует.

Вы можете отображать шрифты FA таким образом, без угловых компонентов (пока) 

<i class="fa fa-angular"></i>

Я также предполагаю, что вы включили FA CSS в index.html head section.

...