相关疑难解决方法(0)

我有分量B,C,D从类继承A.

我想在课堂上使用一个服务A,但我不知道如何注入它,而不是从孩子那里注入它.

我尝试的是正常注入: constructor(pageName: string = null, translate: TranslateService) { 但是当我super()构建类时A,它会抛出错误,因为我没有提供第二个参数.

有没有办法使用Angular 2注入父类？

我被迫使用的Angular版本是:2.2.1

编辑:

一些示例案例:我有很多页面,每个页面都可以显示一个加载器.我不想每次都注入加载器,而是从每个页面管理加载器,我想:

export class BaseComponent {
    constructor(private loader: LoadingService) {}

    showLoading() {
        this.loader.show();
    }
}

然后从组件本身继承:

@Component({
    selector: "page-login",
    providers: [UsersService],
    templateUrl: "login.html"
})
export class LoginPage extends BaseComponent {
    constructor(private usersService: UsersService) {
        super();
    }
}

现在LoginPage有一个showLoading来自它的父方法.

我正在尝试在应用程序启动之前加载一些数据.我需要这样做的原因是因为某些菜单基于某些用户条件限制了访问,例如,基于用户位置.

因此,如果用户还没有位置或者它的位置未能访问某些视图,我需要阻止它.

我尝试使用Angular Resolve方法,但没有成功,这就是我所做的:

解决警卫

// The apiService is my own service to make http calls to the server.
@Injectable()
export class AppResolveGuard implements Resolve<any> {
    constructor(
        private _api: ApiService,
        private _store: Store<IStoreInterface>,
    ) { }

    resolve(): any {
        return this._api.apiGet('loadData').subscribe(response => {
            this._store.dispatch({
                type: USER_FETCH_DATA,
                payload: response.usuario
            });

            return response;
        });
    }
}

路由

export const routing = [
    {
        path: '', component: AppComponent, canActivateChild: [AuthGuard], resolve: {app: AppResolveGuard},
        children: [
            { path: 'home', component: HomeComponent },
            { path: …

在我们的 Angular 应用程序中，我们需要在初始化应用程序之前从服务器加载配置设置。

使用APP_INITIALIZER如这样伟大的作品：

export function loadConfig(config: ConfigService) => () => config.load()

@NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule,
        routes,
        FormsModule,
        HttpModule],
    providers: [
        ConfigService,
        {
            provide: APP_INITIALIZER,
            useFactory: loadConfig,
            deps: [ConfigService],
            multi: true
        }
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
}

然后我扩展了 ErrorHandler 来创建一个 GlobalErrorHandler 并想告诉 Angular 使用我们的 GlobalErrorHandler，所以我提供了 ErrorHandler 并告诉 Angular 使用类 GlobalErrorHandler。

    providers: [
            ConfigService,
            {
                provide: APP_INITIALIZER,
                useFactory: loadConfig,
                deps: [ConfigService],
                multi: true
            },        
            {
                provide: ErrorHandler,
                useClass: GlobalErrorHandler
            }
    ]

GlobalErrorHandler …

如果我在我的类中使用装饰器,则在导入类时会评估装饰器.这是一个小例子:

@NgModule({ ... })
export class BModule { ... }

透露为:

var BModule = (function () {
    function BModule() {
    }
    BModule = __decorate([  <---------- decorators are applied here
        core_1.NgModule({...})
    ], BModule);
    return BModule;
}());
exports.BModule = BModule;

但是,当在@angular包中应用模块或任何其他装饰器时,输出如下:

var HttpClientModule = (function () {
    function HttpClientModule() {
    }
    return HttpClientModule;
}());
HttpClientModule.decorators = [
    { type: _angular_core.NgModule, args: [{ ... },] },
];

如您所见,装饰器不适用于此处.他们只是保存在decorators酒店.为什么它与我的代码不同？

我问的原因是,在导入我的装饰类时,我希望它应用了装饰器,因此可以使用Reflect:

const providers = Reflect.getOwnMetadata('annotations', BModule);

但是,对于@angular包中的装饰类,它不能以这种方式工作.