I have a problem on putting "ngx-spinner" on my angular application.
I imported modules on app.module.ts
:
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgxSpinnerModule } from 'ngx-spinner';
...
imports: [
BrowserModule,
NgxSpinnerModule,
BrowserAnimationsModule,
],
providers: [],
bootstrap: [AppComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
export class AppModule {}
On my component.ts
i imported NgxSpinnerService like this :
...
import { NgxSpinnerService } from 'ngx-spinner';
...
export class MyComponent {
constructor(
private spinner: NgxSpinnerService
) {}
...
onAppReady($event: L.Map) {
this.spinner.show();
}
...
In my component.html
i put my ngx-spinner like this :
<ngx-spinner
bdColor = "rgba(51, 51, 51, 0.8)"
size = "large"
color = "#934d4d"
[fullScreen]="true"
type = "ball-8bits">
LOADING ...
</ngx-spinner>
When i open my app , the page is dark and i can see the "LOADING..." text, but the icon doesn't appear at the center.
Someone can help me plase ?