使用微调器作为全局服务
Using spinner as global service
我正在使用 ng2-admin 主题中的以下微调器:
import {Injectable} from '@angular/core';
@Injectable()
export class BaThemeSpinner {
private _selector:string = 'preloader';
private _element:HTMLElement;
constructor() {
this._element = document.getElementById(this._selector);
}
public show():void {
this._element.style['display'] = 'block';
}
public hide(delay:number = 0):void {
setTimeout(() => {
this._element.style['display'] = 'none';
}, delay);
}
}
所以对于每个组件我都必须导入它,我想避免它,因为很多组件都会使用它。我怎样才能让它对整个应用程序可用?
您可以创建一个基础组件并放置一个 getter 就像
export class BaseView {
protected _injector:Injector;
protected _spinnerService:SpinnerService;
constructor() {
let providers = ReflectiveInjector.resolve([SpinnerService]);
this._injector = ReflectiveInjector.fromResolvedProviders(providers);
}
get spinnerService(): SpinnerService {
if (this._spinnerService == null) {
this._spinnerService = this._injector.get(SpinnerService);
}
return this._spinnerService;
}
}
然后使用它:
this.spinnerService.show()
ReflectiveInjector 可以在 @angular/core
中找到
文档:https://angular.io/docs/ts/latest/api/core/index/ReflectiveInjector-class.html
我正在使用 ng2-admin 主题中的以下微调器:
import {Injectable} from '@angular/core';
@Injectable()
export class BaThemeSpinner {
private _selector:string = 'preloader';
private _element:HTMLElement;
constructor() {
this._element = document.getElementById(this._selector);
}
public show():void {
this._element.style['display'] = 'block';
}
public hide(delay:number = 0):void {
setTimeout(() => {
this._element.style['display'] = 'none';
}, delay);
}
}
所以对于每个组件我都必须导入它,我想避免它,因为很多组件都会使用它。我怎样才能让它对整个应用程序可用?
您可以创建一个基础组件并放置一个 getter 就像
export class BaseView {
protected _injector:Injector;
protected _spinnerService:SpinnerService;
constructor() {
let providers = ReflectiveInjector.resolve([SpinnerService]);
this._injector = ReflectiveInjector.fromResolvedProviders(providers);
}
get spinnerService(): SpinnerService {
if (this._spinnerService == null) {
this._spinnerService = this._injector.get(SpinnerService);
}
return this._spinnerService;
}
}
然后使用它:
this.spinnerService.show()
ReflectiveInjector 可以在 @angular/core
中找到文档:https://angular.io/docs/ts/latest/api/core/index/ReflectiveInjector-class.html