diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts
index 512d959c5fc..47ff4d057d5 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts
@@ -24,14 +24,22 @@ import { filter } from 'rxjs/operators';
   styleUrls: ['./loader-bar.component.scss'],
 })
 export class LoaderBarComponent implements OnDestroy, OnInit {
+  protected _isLoading: boolean;
+
   @Input()
-  containerClass = 'abp-loader-bar';
+  set isLoading(value: boolean) {
+    this._isLoading = value;
+    this.cdRef.detectChanges();
+  }
+  get isLoading(): boolean {
+    return this._isLoading;
+  }
 
   @Input()
-  color = '#77b6ff';
+  containerClass = 'abp-loader-bar';
 
   @Input()
-  isLoading = false;
+  color = '#77b6ff';
 
   progressLevel = 0;