Angular5 http最佳做法

Sam*_*gun 2 rest observable typescript angular angular5

我正在使用Angular 5构建一些应用程序(是的,不止一个).我正在尝试遵循所有Angular dos和don'ts

但我无法理解一些事情

1)这个之间的区别......

this._http.get<User>(this._ubiRest.servicesUrls.getUser)
Run Code Online (Sandbox Code Playgroud)

...还有这个

this._http.get(this._ubiRest.servicesUrls.getUser)
Run Code Online (Sandbox Code Playgroud)

如果反正我必须使用map方法来强制转换为User(或者我可能不会?)

2)在服务中这样做会更好......

getUserData(): Observable<User> {

        return new Observable((observable) => {

            if (!!this._loggedUser) {
                observable.next(this._loggedUser);
                observable.complete();
            }
            else {
                this._http.get(this._ubiRest.servicesUrls.getUser)
                    .map(this._extractData)
                    .subscribe(user => {
                        this._loggedUser = user;
                        observable.next(user);
                        observable.complete();
                    }, this._handleError);
            }

        })
    }
Run Code Online (Sandbox Code Playgroud)

...或这个?

getUserDataX(): Observable<User> {
    if (!!this._loggedUser) {
        return new Observable(observable => {
            observable.next(this._loggedUser);
            observable.complete();
        });
    }
    else {
        return this._http.get<User>(this._ubiRest.servicesUrls.getUser)
           .map(this._extractData)
           .catch(this._handleError);
    }
}
Run Code Online (Sandbox Code Playgroud)

Est*_*ask 5

"最佳实践"是使用Angular 4 HttpClient而不是Angular 2 Http.OP中的代码看起来像是HttpClient,而不是Http.

这个区别......

无论如何我必须使用map方法强制转换为User类型

泛型方法的要点是泛型参数类型在内部某处使用.这会影响observable的类型:

this._http.get<User>(this._ubiRest.servicesUrls.getUser)
.map(user => { /* user has User type */ })
Run Code Online (Sandbox Code Playgroud)

这可以在HttpClientAPI中清楚地看到; get(...)返回Observable<any>get<T>(...)返回Observable<T>.

在服务中会更好地做到这一点......

以上都不是.new Observable(observable => { ... })是可观察的构造函数反模式,是承诺构造函数反模式的副本.它是:

   if (!!this._loggedUser) {
        return Observable.of(this._loggedUser);
    }
    else {
        return this._http.get<User>(this._ubiRest.servicesUrls.getUser)
       .map(this._extractData)
       .catch(this._handleError);
    }
Run Code Online (Sandbox Code Playgroud)

  • 我读了它,它清楚地说'Angular2 http最佳实践'.说实话,低估自己的答案并不是获得帮助的最佳方式. (3认同)