我们目前正在开发一个Angular4应用程序,并希望获得关于服务架构的反馈。
该应用程序的五个“模块”分别是:
- one - two - three - four - five 目前,我们有一个仅针对one的数据服务。但是,抽象类ApiService可以在其他四个模块中导入(请参见下面的代码)。
以下是我考虑的一些选项:
选项1: 将抽象类ApiService移动到我们的共享文件夹模块中,即将共享文件夹模块导入到每个模块中。然后创建一个针对每个模块特定的服务,该服务继承自ApiService。这样可以轻松管理每个单独的服务。
选项2: 将抽象类移动到共享文件夹中,并创建一个包含所有五个模块的API调用的全局服务。这样,我们就有了一个单一的服务来管理所有API连接。然而,文件可能会变得有点大并且难以管理。您对如何组织有何想法?
选项3: 完全放弃可观察到的服务,并使用类似ngrx/store来处理状态。
我正在寻求有关数据服务架构的反馈。
module-one-data-service.ts
该应用程序的五个“模块”分别是:
- one - two - three - four - five 目前,我们有一个仅针对one的数据服务。但是,抽象类ApiService可以在其他四个模块中导入(请参见下面的代码)。
以下是我考虑的一些选项:
选项1: 将抽象类ApiService移动到我们的共享文件夹模块中,即将共享文件夹模块导入到每个模块中。然后创建一个针对每个模块特定的服务,该服务继承自ApiService。这样可以轻松管理每个单独的服务。
选项2: 将抽象类移动到共享文件夹中,并创建一个包含所有五个模块的API调用的全局服务。这样,我们就有了一个单一的服务来管理所有API连接。然而,文件可能会变得有点大并且难以管理。您对如何组织有何想法?
选项3: 完全放弃可观察到的服务,并使用类似ngrx/store来处理状态。
我正在寻求有关数据服务架构的反馈。
module-one-data-service.ts
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { IPosition } from './position.model';
import { IPositionReference } from '../shared/side-pane/position-reference.model';
import { Subject } from 'rxjs/Subject';
export abstract class ApiService {
protected BASE_URL = 'http://justtheurl.com';
protected baseAndModuleUrl: string;
private OPTIONS = new RequestOptions({
headers: new Headers({
'Authorization' : 'Basic thisIsJustForTesting'
}),
withCredentials: true
});
constructor(private http: Http, private module: string) {
this.baseAndModuleUrl = `${this.BASE_URL}${module}`;
}
public getBaseModuleUrl() { return this.baseAndModuleUrl; }
protected fetch(apiAction: string): Observable<any> {
return this.http
.get(`${this.baseAndModuleUrl}${apiAction}`, this.OPTIONS)
.map((res: Response) => res.json().data);
}
protected post(apiAction: string, positions: Object[]): Observable<any> {
return this.http
.post(`${this.baseAndModuleUrl}${apiAction}`, positions, this.OPTIONS)
.map((res: Response) => res.json());
}
protected upload(apiAction: string, file: FormData): Observable<any> {
return this.http
.post(`${this.baseAndModuleUrl}${apiAction}`, file, this.OPTIONS)
.map((res: Response) => res.json());
}
}
@Injectable()
export class ModuleOneDataService extends ApiService {
public editableValues = new Subject<any>();
constructor(http: Http) { super(http, '/api/module/one'); }
public fetchTree(): Observable<IPosition[]> { return this.fetch('/tree'); }
public fetchList(): Observable<IPosition[]> { return this.fetch('/list'); }
public fetchIndividual(id: string): Observable<IPositionReference> { return this.fetch(`/node/${id}`); }
public savePositionsToSubgraph(positions: Object[]): Observable<any> { return this.post('/subgraph/upsert', positions); }
public mergeSubraphToMaster(): Observable<Object> { return this.post('/subgraph/merge', [{}]); }
}