以角度2手动注入Http

时间:2016-08-31 07:40:29

标签: angular

我创建了一个基本模型,其中我有所有常用函数来获取数据并发布或放置数据。实际上服务是什么角度,但我不想要一个服务。不,我打算做的是基础模型将扩展到我的系统中的所有模块,每个模块都有其基本端点来从API获取数据。现在问题如果我在基本模型中注入Http服务并且用户模型扩展了Base模型,现在要创建一个基本模型的对象,我需要传递Http的对象,这是我无法实现的。

如果您需要更多支持来回答此问题,请与我们联系。

export class BaseModel {
constructor (http: Http) {}

fetch() {
let params = {
            "includes": this.includes,
            "page": page,
            "filters" : this.filters,
            "order" : this.orderDirection + this.orderColumn
        };

        return this.api.get("/"+this.endpoint, params)
            .map(
                (response: any) => {
                    let total = response.meta.total;
                    let current = response.meta.current;

                    let min = current - 5;
                    let max = current + 5;

                    if (min < 1) {
                        min = 1;
                    }

                    if (max > total) {
                        max = total;
                    }
                    else if (max < 10) {
                        if(total < 10) {
                            max = total;
                        }else {
                            max = 10;
                        }
                    }

                    let pages : number[] = [];

                    for (let i = min; i <= max; i++) {
                        pages.push(i);
                    }

                    this.pages = pages;

                    return response
                }
            );
}
}

现在是我的用户模型

export class User extends BaseModel {

public id : number;
    public username : string;
    public email : string;
    public password : string;
    public passwordConfirmation : string;
    public details : UserDetail = new UserDetail();
    public type : string;
    public status : string;
    public profileImage : string;
    public profileImageUrl : string;
    public crop : Object = {};
    public lastLogin : string;
    public numberOfLogin : string;
    public joinDate : string;
    public registerType : string = "web";

    public static create(response : any) {

        if (response === undefined || response === null) {
            return response;
        }

        let details = new UserDetail();

        if (response.details) {
            details = UserDetail.create(response.details);
        }

        let user = new User(); //error parameter required
        user.id = response.id;
        user.username = response.username;
        user.email = response.email;
        user.status = response.status;
        user.type = response.type;
        user.details.id = response.details.id;
        user.details = details;
        user.profileImageUrl = response.profile_image_url;
        user.joinDate = response.created_at;
        user.registerType = response.register_type;

        return user;
    }

}

2 个答案:

答案 0 :(得分:14)

更新(最终)

constructor() {
  let injector = ReflectiveInjector.resolveAndCreate([
    Http,
    BrowserXhr,
    {provide: RequestOptions, useClass: BaseRequestOptions},
    {provide: ResponseOptions, useClass: BaseResponseOptions},
    {provide: ConnectionBackend, useClass: XHRBackend},
    {provide: XSRFStrategy, useFactory: () => new CookieXSRFStrategy()},
  ]);
  this.http = injector.get(Http);
}

ORIGINAL(RC.x)

constructor() {
  let injector = ReflectiveInjector.resolveAndCreate([HTTP_PROVIDERS]);
  this.http = injector.get(Http);
}

这会创建一个新的注入器(独立于Angular2应用程序的其余部分使用的注入器。这不一定是个问题,你应该知道它。

另见angular2 resolveAndCreate HTTP - missing HTTP_PROVIDERS in RC7

答案 1 :(得分:5)

在Angular 2.1中有效的丑陋解决方案

import {ReflectiveInjector} from '@angular/core';
import {Http, HttpModule} from "@angular/http";

const providers = (<any>HttpModule).decorators[0].args[0].providers;
const injector = ReflectiveInjector.resolveAndCreate(providers);
const http = injector.get(Http);