+ `,
+})
+class TdLoadingNamedErrorStarUntilAsyncTestComponent {
+ private _subject: Subject = new Subject();
+ observable: Observable;
+
+ constructor(private _loadingService: TdLoadingService) {}
+
+ createObservable(): void {
+ this.observable = this._subject.asObservable().catch(() => {
+ this._loadingService.resolveAll('name1');
+ return Observable.of(undefined);
+ });
+ }
+
+ sendError(error: any): void {
+ this._subject.error(error);
+ }
+}
+
+@Component({
+ selector: 'td-loading-boolean-template-until-test',
+ template: `
+
+
+
+ `,
+})
+class TdLoadingBooleanTemplateUntilTestComponent {
+ loading: boolean = false;
+}
diff --git a/src/platform/core/loading/directives/loading.directive.ts b/src/platform/core/loading/directives/loading.directive.ts
index 603bcc34b9..92c0c27f14 100644
--- a/src/platform/core/loading/directives/loading.directive.ts
+++ b/src/platform/core/loading/directives/loading.directive.ts
@@ -5,11 +5,23 @@ import { LoadingType, LoadingMode, LoadingStrategy, TdLoadingComponent } from '.
import { TdLoadingService } from '../services/loading.service';
import { ILoadingRef } from '../services/loading.factory';
+/**
+ * Context class for variable reference
+ */
+export class TdLoadingContext {
+ public $implicit: any = undefined;
+ public tdLoading: any = undefined;
+}
+
+// Constant for generation of the id for the next component
+let TD_LOADING_NEXT_ID: number = 0;
+
@Directive({
selector: '[tdLoading]',
})
export class TdLoadingDirective implements OnInit, OnDestroy {
+ private _context: TdLoadingContext = new TdLoadingContext();
private _type: LoadingType;
private _mode: LoadingMode;
private _strategy: LoadingStrategy;
@@ -17,12 +29,35 @@ export class TdLoadingDirective implements OnInit, OnDestroy {
private _loadingRef: ILoadingRef;
/**
- * tdLoading?: string
+ * tdLoading: string
* Name reference of the loading mask, used to register/resolve requests to the mask.
*/
@Input('tdLoading')
set name(name: string) {
- this._name = name;
+ if (!this._name) {
+ if (name) {
+ this._name = name;
+ }
+ }
+ }
+
+ /**
+ * tdLoadingUntil?: any
+ * If its null, undefined or false it will be used to register requests to the mask.
+ * Else if its any value that can be resolved as true, it will resolve the mask.
+ * [name] is optional when using [until], but can still be used to register/resolve it manually.
+ */
+ @Input('tdLoadingUntil')
+ set until(until: any) {
+ if (!this._name) {
+ this._name = 'td-loading-until-' + TD_LOADING_NEXT_ID++;
+ }
+ this._context.$implicit = this._context.tdLoading = until;
+ if (!until) {
+ this._loadingService.register(this._name);
+ } else {
+ this._loadingService.resolveAll(this._name);
+ }
}
/**
@@ -112,14 +147,13 @@ export class TdLoadingDirective implements OnInit, OnDestroy {
// Check if `TdLoadingComponent` has been created before trying to add one again.
// There is a weird edge case when using `[routerLinkActive]` that calls the `ngOnInit` twice in a row
if (!this._loadingRef) {
- this._viewContainerRef.createEmbeddedView(this._templateRef);
this._loadingRef = this._loadingService.createComponent({
name: this._name,
type: this._type,
mode: this._mode,
color: this.color,
strategy: this._strategy,
- }, this._viewContainerRef, this._templateRef);
+ }, this._viewContainerRef, this._templateRef, this._context);
}
}
}
diff --git a/src/platform/core/loading/services/loading.factory.ts b/src/platform/core/loading/services/loading.factory.ts
index 9a93a81eff..e867ebfde1 100644
--- a/src/platform/core/loading/services/loading.factory.ts
+++ b/src/platform/core/loading/services/loading.factory.ts
@@ -5,6 +5,7 @@ import { Subject } from 'rxjs/Subject';
import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';
+import { TdLoadingContext } from '../directives/loading.directive';
import { TdLoadingComponent, LoadingType, LoadingMode, LoadingStrategy, LoadingStyle } from '../loading.component';
import { ITdLoadingConfig} from './loading.service';
@@ -100,13 +101,14 @@ export class TdLoadingFactory {
* Saves a reference in context to be called when registering/resolving the loading element.
*/
public createReplaceComponent(options: ITdLoadingConfig, viewContainerRef: ViewContainerRef,
- templateRef: TemplateRef