ngx-admin-lte
ngx-admin-lte copied to clipboard
TwanoO67
Avoid wrong click.
Hello,
How are we supposed to use the AppLoadingComponent ? Can you provide Example ?
It seems he encapsuled in an exportable component the black squares that animate during app loading. He got them from bootstrapping-ngx-admin-lte (index.html). I think it's not a bad idea, but the question is: if app is not initialized yet, how can those squares displayed? It needs to be tried, I've some doubts.
Hello, @fabioformosa, @TwanoO67 Yes fabio. I did something like that but with a different loading style component. Here is an example of use. I use AppLoadingComponent out of the 'AuthComponent'. I use it in AppComponent:
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
isLoading = true;
constructor(public router: Router) {
router.events.subscribe((event: RouterEvent) => {
this.navigationInterceptor(event)
})
}
navigationInterceptor(event: RouterEvent): void {
if (event instanceof NavigationStart) {
this.isLoading = true
}
if (event instanceof NavigationEnd) {
this.isLoading = false
}
if (event instanceof NavigationCancel) {
this.isLoading = false
}
if (event instanceof NavigationError) {
this.isLoading = false
}
}
}
And here is the AppComponent HTML Example like bootstraping-ngx-admin-lte
<app-route-loading [loading]="isLoading" ></app-route-loading>
<router-outlet></router-outlet>
The component is in the ngx-admin-lte module, separeted from the form of how the users will use it. In this example i use the component in AppComponent but can use it in another way.
IMPORTANT: To really see the component in action, its good to create a resolve that makes any http request that takes some time just to simulate a real scenario.
Observation: My english is bad. So sorry for any mistakes i've made.
Ok, I understand. It would be great if loading template was customizable through ng-content and the squares were a fallback strategy. The business logic of hide/show could be embedded in the loading component, couldn't it?
Yeah, It would be great if loading template was customizable through ng-content.
@fabioformosa The business logic of hide/show could be embedded in the loading component, couldn't it? i dont think that its a good idea. Its good to left the business logic to the user to create as he desire.
If you give to the component the name AppLoadingComponent, the only possible logic seems to me a loader that freezes all app (handle the boolean "isLoading", apply a curtain, etc). Instead, I would like to define the style of loader.
If you have a component customizable in style and logic, likely it's would be almost empty and its name should be AComponentShallDoEverythingYouWant.