我想通过创建来自类的数据访问对象来隔离http交互,这样在组件中我就可以简单地获得如下数据:
// dashboard.component
import { AppUser } from './appuser.service'
export class DashboardComponent implements OnInit {
user: AppUser = new AppUser();
constructor() { }
ngOnInit() {
let id = JSON.parse(window.localStorage.getItem('session')).userId;
this.user.find(id) // 'find' is from base class
.subscribe(
// handle user data
);
}
}
我定义了一个基类和一个子类,如下所示:
// base-resource.service
import { HttpClient } from '@angular/common/http';
...
export class BaseResource {
private fullpath: string;
protected http: HttpClient;
constructor (path: string) {
this.fullpath = path;
}
find (id): Observable<Object> {
return this.http.get(this.fullpath + '/' + id); // this line throws Error!
}
}
// app-user.service
...
export class AppUser extends BaseResource {
constructor(data?) {
super('api/appusers');
}
}
但是,这会在基类函数中生成一个错误:ERROR TypeError: Cannot read property 'get' of undefined
。
我的'AppUser‘实例显然是从'BaseResource’继承了find
,但是find
选择了'AppUser‘实例,因为this
和http
的值不可用。我曾尝试将http
声明为公共和私有以及受保护的,但没有效果。我想我错过了一些关于如何扩展类的更大的图景。
具体地说,我想我的问题是,当函数需要访问基类的上下文时,如何将函数抽象为基类。
(使用Angular 6.0.4)
编辑我更新了标题,因为很明显这是在类中实例化HttpClient服务的问题。
发布于 2018-07-16 18:03:03
错误是因为没有实例化HttpClient,所以当您使用它时,它是未定义的。
您应该将HttpClient
注入到AppUser
中,并通过构造函数将其传递给BaseResource
export class AppUser extends BaseResource {
constructor(HttpClient http) {
super(http, 'api/appusers');
}
}
和base-resource.service中
import { HttpClient } from '@angular/common/http';
...
export class BaseResource {
private fullpath: string;
protected http: HttpClient;
constructor (httpClient: HttpClient, path: string) {
this.fullpath = path;
this.http = httpClient;
}
find (id): Observable<Object> {
return this.http.get(this.fullpath + '/' + id); // this line throws Error!
}
}
https://stackoverflow.com/questions/51367472
复制相似问题