Angular2 RC6 HttpModule手动注塑

der*_*awe 3 typescript angular2-forms angular2-injection angular

我正在将一个项目从angular2 RC4迁移到RC6,我有一个需要的自定义Form Validator Http.在迁移之前我使用了ReflectiveInjectorwith HTTP_PROVIDERS,但是使用了RC6,这已经不再可能了,因为HTTP_PROVIDERS已经弃用了,分别不再存在了.这是Validator中的静态方法:

    static checkVat(control: FormControl) {
    let checkVatUrl = "http://localhost:8080/checkvat";


    let injector = ReflectiveInjector.resolveAndCreate([HTTP_PROVIDERS]);
    let http = injector.get(Http);
    let authHttp = new AuthHttp(new AuthConfig(), http);

    if (control.value === "") {
        return new Observable((obs: any) => {
            obs.next(null);
            obs.complete();
        });
    } else {
        return authHttp.get(checkVatUrl + "/" + control.value)
            .map((data: Response) => {
                if (data.json().valid) {
                    return null;
                } else {
                    let reason = "isNotValidVat";
                    return {[reason]: true};
                }
            })
            .catch(function (e) {
                return new Observable((obs: any) => {
                    obs.complete();
                });
            });
    }
}
Run Code Online (Sandbox Code Playgroud)

只需更换HTTP_PROVIDERSHttpModule没有工作,我在这里找到了类似的问题上计算器(NG2 RC5:HTTP_PROVIDERS已被弃用)有关测试,但唯一的答案是具体的测试.

我如何手动"注入" HttpHttpModule使用RC6,如果这个自定义验证器有另一个或更好的解决方案,我也会对此开放.

提前致谢.

更新:该checkVat方法是静态的,这就是为什么我必须使用ReflectiveInjector而不是像其他地方一样通过构造函数注入它.自定义Validator的使用方式如下:

this.vatCtrl = new FormControl("", Validators.compose([Validators.pattern(this.vatService.vatPattern)]),VatValidator.checkVat);
Run Code Online (Sandbox Code Playgroud)

更新2:在GüntherZöchbauer的回答的帮助下,我按照以下方式更改了代码,使其无需静态功能,无需手动注入:

验证者:

@Injectable()
Run Code Online (Sandbox Code Playgroud)

export class VatValidator {

constructor(private http: Http) {
}

checkVat(control: FormControl) {

    let checkVatUrl = "http://localhost:8080/checkvat";

    let authHttp = new AuthHttp(new AuthConfig(), this.http);

    if (control.value === "") {
        return new Observable((obs: any) => {
            obs.next(null);
            obs.complete();
        });
    } else {
        return authHttp.get(checkVatUrl + "/" + control.value)
            .map((data: Response) => {
                if (data.json().valid) {
                    return null;
                } else {
                    let reason = "isNotValidVat";
                    return {[reason]: true};
                }
            })
            .catch(function (e) {
                return new Observable((obs: any) => {
                    obs.complete();
                });
            });
    }

}
Run Code Online (Sandbox Code Playgroud)

}

在具有FormControl的组件中:

    constructor(private vatValidator: VatValidator) {

    this.vatCtrl = new FormControl("", Validators.compose([Validators.pattern(vatPattern)]), this.vatValidator.checkVat.bind(this.vatValidator));

}
Run Code Online (Sandbox Code Playgroud)

Ale*_*exV 12

import { ReflectiveInjector } from '@angular/core';
import { Http, XHRBackend, ConnectionBackend, BrowserXhr, ResponseOptions, XSRFStrategy, BaseResponseOptions, CookieXSRFStrategy, RequestOptions, BaseRequestOptions } from '@angular/http';

class MyCookieXSRFStrategy extends CookieXSRFStrategy {}

...

let http =  ReflectiveInjector.resolveAndCreate([
        Http, BrowserXhr, 
        { provide: ConnectionBackend, useClass: XHRBackend },
        { provide: ResponseOptions, useClass: BaseResponseOptions },
        { provide: XSRFStrategy, useClass: MyCookieXSRFStrategy },
        { provide: RequestOptions, useClass: BaseRequestOptions }
      ]).get(Http);
Run Code Online (Sandbox Code Playgroud)

当然,你仍然需要HttpModule,享受!

  • 这很好但非常笨重.@AlexV你有没有把它带到Anuglar团队作为功能要求改进这个并使其更容易? (2认同)