diff --git a/matsen-tool/src/app/_components/paging/paging.component.html b/matsen-tool/src/app/_components/paging/paging.component.html
index 7805013..2672063 100644
--- a/matsen-tool/src/app/_components/paging/paging.component.html
+++ b/matsen-tool/src/app/_components/paging/paging.component.html
@@ -27,6 +27,6 @@
showFirstLastButtons>
-
+
diff --git a/matsen-tool/src/app/_components/paging/paging.component.ts b/matsen-tool/src/app/_components/paging/paging.component.ts
index 4ffbf53..2f45ad5 100644
--- a/matsen-tool/src/app/_components/paging/paging.component.ts
+++ b/matsen-tool/src/app/_components/paging/paging.component.ts
@@ -1,15 +1,16 @@
-import {ChangeDetectorRef, Component, Input, OnInit, ViewChild} from '@angular/core';
+import {AfterViewInit, ChangeDetectorRef, Component, Input, OnInit, ViewChild} from '@angular/core';
import {MatPaginator, MatPaginatorIntl, PageEvent} from "@angular/material/paginator";
import {FormBuilder, FormGroup} from "@angular/forms";
import {debounceTime, distinctUntilChanged, Subscription} from "rxjs";
import {LoadingService} from "@app/_services/loading.service";
+import {load} from "@angular-devkit/build-angular/src/utils/server-rendering/esm-in-memory-loader/loader-hooks";
@Component({
selector: 'app-paging',
templateUrl: './paging.component.html',
styleUrl: './paging.component.scss'
})
-export class PagingComponent implements OnInit {
+export class PagingComponent implements OnInit, AfterViewInit {
@Input() public dataSource!: any;
@Input() public getDataFunction!: Function;
@@ -27,27 +28,22 @@ export class PagingComponent implements OnInit {
protected pageIndex: number;
public searchForm!: FormGroup;
public loadingSub: Subscription;
- public loading: boolean;
+ public loading: boolean = false;
+ public showLoading: boolean = false;
constructor(
private fb: FormBuilder,
- private loadingService: LoadingService
+ private loadingService: LoadingService,
+ private cdr: ChangeDetectorRef
) {
this.dataLength = 0;
this.pageEvent = new PageEvent();
this.pageIndex = 0;
this.searchable = false;
this.loadingSub = new Subscription();
- this.loading = false;
}
ngOnInit() {
- this.loadingSub = this.loadingService.getLoading().subscribe(
- loading => {
- this.loading = loading;
- console.log(this.loading);
- }
- );
this.pageSize = this.pageSize !== undefined ? this.pageSize : this.defaultPageSize;
this.pageSizeOptions = this.pageSizeOptions !== undefined ? this.pageSizeOptions : this.defaultPageSizeOptions;
this.paginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype);
@@ -63,9 +59,20 @@ export class PagingComponent implements OnInit {
this.getData()
});
}
+
+ this.loadingSub = this.loadingService.getLoading().subscribe(
+ loading => {
+ this.loading = loading;
+ // To avoid Error: NG0100
+ this.cdr.detectChanges();
+ }
+ );
+ this.showLoading = true;
+ this.cdr.detectChanges();
}
ngAfterViewInit() {
+
}
getData() {
diff --git a/matsen-tool/src/app/_helpers/loading-interceptor.service.ts b/matsen-tool/src/app/_helpers/loading-interceptor.service.ts
index fd8432b..eb45945 100644
--- a/matsen-tool/src/app/_helpers/loading-interceptor.service.ts
+++ b/matsen-tool/src/app/_helpers/loading-interceptor.service.ts
@@ -9,7 +9,6 @@ import {LoadingService} from "@app/_services/loading.service";
@Injectable()
export class LoadingInterceptor implements HttpInterceptor {
constructor(
- private accountService: AccountService,
private loadingService: LoadingService
) { }