Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    saboehnke
    @saboehnke
    That fixed the issue. Thanks @Napster2210
    camel99
    @camel99

    hi guys, any idea why spinner is not being hide on finalize?
    a.component.ts

      ngAfterViewInit() {
        this.subscriptions.add(
          this.organizationsService.organizations$
            .pipe(
              tap(() => {
                this.spinnerService.showLoader();
              }),
              finalize(() => {
                this.spinnerService.hideLoader();
              }),
              takeUntil(this.destroySubject))
            .subscribe(response => {
              this.cachedFacts = this.cachedFacts.concat(response);
              if (!this.searchService.search.value.length) {
                this.dataSource.data = this.cachedFacts as IOrganizations[];
                this.dataSource.sort = this.sort;
              } else {
                this.dataSource.data = response as IOrganizations[];
                this.cachedFacts = [];
              }
              this.filterSelectObj.filter((o) => {
                o.options = this.getFilterObject(this.dataSource.data, o.columnProp);
              });
            }, (error) => {
              this.errorService.handleError(error);
            })
        );
    
      }

    spinner.service.ts

    import { Injectable } from '@angular/core';
    import { BehaviorSubject } from 'rxjs';
    import { NgxSpinnerService } from 'ngx-spinner';
    
    @Injectable()
    export class SpinnerService {
      constructor(private spinnerService: NgxSpinnerService) { }
    
      public showLoaderSubject = new BehaviorSubject<boolean>(false);
    
      showLoader() {
        // this.showLoaderSubject.next(true);
        this.spinnerService.show();
      }
      hideLoader() {
        // this.showLoaderSubject.next(false);
        this.spinnerService.hide();
      }
    }

    spinner.module.ts

    import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import { SpinnerComponent } from './spinner.component';
    import { NgxSpinnerModule, NgxSpinnerService } from 'ngx-spinner';
    import { SpinnerService } from '@shared/services/spinner.service';
    
    @NgModule({
      imports: [
        CommonModule,
        NgxSpinnerModule
      ],
      declarations: [SpinnerComponent],
      exports: [SpinnerComponent],
      providers: [SpinnerService, NgxSpinnerService]
    })
    export class SpinnerModule { }
    camel99
    @camel99
    sry, actually question is why is not shown. if I remove finalize then is shown but obviously never hides
    Burhan
    @ibuli
    Hi
    is there any way to overwrite the default classes using custom css?
    captured.gif
    Also, I'm not sure if anybody has realized but there's this weird animation issue.
    @Napster2210
    Burhan
    @ibuli
    The same happens on the demo page too
    Yuvraj Chauhan
    @Napster2210
    @ibuli I will look into it, thanx
    Burhan
    @ibuli
    Great thanks @Napster2210 , also please help me if I can overwrite the CSS in any way.
    In the mobile view, the loading text overlaps the loader and doesn't look good.
    Burhan
    @ibuli
    image.png
    Screenshot for the same if needed
    Burhan
    @ibuli
    That's fine I resolved the custom css point using ::ng-deep
    Yuvraj Chauhan
    @Napster2210
    Great! @ibuli
    Hello @all
    Few things are affected to me due to this pandemic situation, I didn't spend my time for this package but I'll try my best to keep updating this package and provide you guys new features soon. Thanx a lot for your support. 😊
    Tagi Asadullazadeh
    @asadullazadeh
    Hi everyone,
    I use ngx-spinner in my angular universal application.
    When I view page-source I see all ngx-spinner classes to my head section
    Tagi Asadullazadeh
    @asadullazadeh
    I think it's not practice thing. How can I remove from here?
    image.png
    cen
    @cennguyen
    image.png
    wll, this is my problem when i tried to add spinner to my project, so could u help me out of here
    Tagi Asadullazadeh
    @asadullazadeh

    image.png

    I recommend doing this manually. Install the plugin with npm and add NgxSpinnerModule to app.module.ts file

    vaddepallysrinivas
    @vaddepallysrinivas
    hi for angular 11 ngx-spinner not working
    image.png
    showing above error while doing instrallation
    Björn Kimminich
    @bkimminich
    If you add the module manually it works fine, also with Angular 11.
    Said Roohullah Allem
    @jahanalem
    I'm new to Angular. Could you please tell me how can I add the module manually?
    Said Roohullah Allem
    @jahanalem
    I solved the problem!
    chitra-c
    @chitra-c
    @Napster2210 Any update on reducing the bundle size of the spinner?
    Yuvraj Chauhan
    @Napster2210
    Not yet @chitra-c
    I will take some time I need help for that. If you have any suggestions please raise PR. Thanx in advance. 😊
    IrinaK
    @Irina0712
    Hi! I'm using Angular 8.2.14 and Ngx-spinner 8.1.0. I have noticed a strange behavior: when calling firstly spinnerService.hide() and then spinnerService.show() it doesn't work for some reasons.
    @Napster2210 is it a known issue ?
    Sepehr Roshanpour
    @separse
    @Irina0712 you should use setTimeOut function
    I have problem with showing spinner in the strat of page
    first, for one moment, it shows a web page then it loads spinner
    Kesavamoorthi
    @k7moor
    Hi Everyone ..Can someone help me with adding spinner to google maps till map is loading ?
    Moacir Silveira Júnior
    @moahrs
    Hello... I am trying to install the ngx-spinner, but i cant... I tried in the angular/cli 11.2.14, and now, 11.0.7 ( they not allow me to install 11.0.0. But always show this error. Someone can help me please?:
    npm WARN ngx-spinner@11.0.1 requires a peer of @angular/common@^11.0.0 but none is installed. You must install peer dependencies yourself.
    npm WARN ngx-spinner@11.0.1 requires a peer of @angular/core@^11.0.0 but none is installed. You must install peer dependencies yourself.
    Yuvraj Chauhan
    @Napster2210
    @moahrs What's the version of Angular in your project?
    Yuvraj Chauhan
    @Napster2210
    @/all New version v12 is now available
    DanielVarzea
    @DanielVarzea
    Hey everyone. Well, I'm working on an Angular app that needs som UI updating. After installing ngx-spinner, I'm getting the error "Angular JIT compilation failed: '@angular/compiler' not loaded!", but there are no compilation errors in the console. I'm using Ivy and my target is ES6. I've tried multiple solutions online, but none seem to work. Anyone had the same problem? Any known solution @Napster2210? Thanks in advance
    DanielVarzea
    @DanielVarzea
    Also worth noting, using Angular 12, with the lastest version of ngx-spinner. Removing the package fixes the problem. And NGCC doesnt compile this specific package after install
    Rishabh Awasthi
    @dev.rishabh_gitlab
    hi
    Deyby Garcia
    @deybygarcia97_gitlab
    Hi Everyone I am using Ngx Spinner latest version. I am trying to use [showSpinner] feature from template but it doesn't seem to be working. Please help me out with this.
    Joel Muskwe
    @joelmuskwe
    Having same issue with [showSpinner] is there any solution
    Yuvraj Chauhan
    @Napster2210
    @deybygarcia97_gitlab @joelmuskwe Can you please create an issue with sample code on GitHub?
    Daniel Martinez Lopez
    @danielmtzlopez
    Hi! Anyone can help me? I just install ngx-spinner last version (12.0.0) but is not showing with Angular 12.2, any lead?