Javascript 如何在Aurelia Typescript中创建通用服务

我目前正在使用Aurelia作为我的前端框架和类型脚本。我有5个具有基本crud功能的实体。如何创建一个通用服务，这样我就不会创建5个具有相同功能的文件？这就是我目前所拥有的。如果我能将其转换为泛型类型并只传递api url，那就太好了。谢谢

import { HttpClient, json } from "aurelia-fetch-client";
import { inject } from "aurelia-framework";

@inject(HttpClient)
export class WheelTypeService {
    public wheelTypes: WheelType[];
    private http: HttpClient;

    constructor(http: HttpClient) {
        http.configure(config => config.useStandardConfiguration());
        this.http = http;
    }

    getAll() {
        var promise = new Promise((resolve, reject) => {
            if (!this.wheelTypes) {
                this.http.fetch('/api/WheelTypes')
                    .then(result => result.json() as Promise<WheelType[]>)
                    .then(data => {
                        this.wheelTypes= data;
                        resolve(this.wheelTypes);
                    })
                    .catch(err => reject(err));
            } else resolve(this.wheelTypes);
        });

        return promise;
    }
 // omitted some of the crud functionalities
}

从“aurelia fetch client”导入{HttpClient，json}；
从“aurelia框架”导入{inject}；
@注入（HttpClient）
出口级轮式打字机服务{
公共车轮类型：车轮类型[]；
私有http:HttpClient；
构造函数（http:HttpClient）{
configure（config=>config.usesStandardConfiguration（））；
this.http=http；
}
getAll（）{
var承诺=新承诺（（解决、拒绝）=>{
如果（！this.wheelTypes）{
this.http.fetch（“/api/WheelTypes”）
.then（result=>result.json（）作为承诺）
。然后（数据=>{
这一点。wheelTypes=数据；
解决（这是一种类型）；
})
.catch（err=>reject（err））；
}else解析（此为wheelTypes）；
});
回报承诺；
}
//省略了一些crud功能
}

您已经看过了吗？我想，这就是你想要的：

您的

车轮类型可能会更改为以下内容：

@resource('/api/WheelTypes') // important point
export class WheelType {
  ...
}

在视图模型中，您可以执行以下操作：

@inject(EntityManager)
export class WheelTypeVM {
    constructor(entityManager) {
      this.repository = entityManager.getRepository('user');
    }

    // your CRUD comes here, e.g.
    getAll() {
      return this.repository.find()
        .then(data => {
           this.wheelTypes = data;
        });
    }
}

这只是一个小摘录，还有一些其他的事情要做（插件配置）。但是，您可以保存每个实体的服务（或者您甚至可以将代码包装在VM中并使用泛型）。
您已经看过了吗？我想，这就是你想要的：

您的
车轮类型可能会更改为以下内容：

@resource('/api/WheelTypes') // important point
export class WheelType {
  ...
}

在视图模型中，您可以执行以下操作：

@inject(EntityManager)
export class WheelTypeVM {
    constructor(entityManager) {
      this.repository = entityManager.getRepository('user');
    }

    // your CRUD comes here, e.g.
    getAll() {
      return this.repository.find()
        .then(data => {
           this.wheelTypes = data;
        });
    }
}

这只是一个小摘录，还有一些其他的事情要做（插件配置）。但是，您可以保存每个实体的服务（或者甚至可以将代码包装在VM中并使用泛型）。
下面是一个使用泛型和typescript的基本示例。接口应与api返回的json结构相匹配。希望这是有帮助的

import { autoinject } from "aurelia-framework";
import { HttpClient } from "aurelia-http-client";

export interface IReturnType1 {
    id: number;
    name: string;
}

export interface IReturnType2 {
    id: number;
    height: string;
    weight: string;
}

@autoinject
export class GenericService {
    constructor(private http: HttpClient) { }

    getOne<T>(url: string): Promise<T> {
        return this.http
            .get(url)
            .then(response => response.content);
    }

    getAll<T>(url: string): Promise<T[]> {
        return this.http
            .get(url)
            .then(response => response.content);
    }
}

@autoinject
export class ConsumerExample {
    constructor(private svc: GenericService) { }

    async getAllReturnType1(){
        const result = await this.svc.getAll<IReturnType1>("url/for/request/1");
    }

    async getOneReturnType2(){
        const result = await this.svc.getOne<IReturnType2>("url/for/request/2");
    }
}

从“aurelia框架”导入{autoinject}；
从“aurelia http客户端”导入{HttpClient}；
导出接口IReturnType1{
id：编号；
名称：字符串；
}
导出接口IReturnType2{
id：编号；
高度：弦；
重量：细绳；
}
@自动注入
导出类泛型服务{
构造函数（私有http:HttpClient）{}
getOne（url:string）：承诺{
返回此文件。http
.get（url）
.然后（response=>response.content）；
}
getAll（url:string）：承诺{
返回此文件。http
.get（url）
.然后（response=>response.content）；
}
}
@自动注入
导出类ConsumerExample{
构造函数（私有svc:GenericService）{}
异步getAllReturnType1（）{
const result=wait this.svc.getAll（“url/for/request/1”）；
}
异步getOneReturnType2（）{
const result=wait this.svc.getOne（“url/for/request/2”）；
}
}

继承示例

import { autoinject } from "aurelia-framework";
import { HttpClient } from "aurelia-http-client";

export interface IReturnType1 {
    id: number;
    name: string;
}

export interface IReturnType2 {
    id: number;
    height: string;
    weight: string;
}

export interface IRequestUrls {
    getOne: string;
    getAll: string;
}

@autoinject
export abstract class GenericService<T> {
    constructor(private http: HttpClient) { }

    abstract urls: IRequestUrls;

    getOne(): Promise<T> {
        return this.http
            .get(this.urls.getOne)
            .then(response => response.content);
    }

    getAll(): Promise<T[]> {
        return this.http
            .get(this.urls.getAll)
            .then(response => response.content);
    }
}

export class Request1 extends GenericService<IReturnType1> {
    urls: {
        getOne: "/url/for/request/1";
        getAll: "/url/for/request/1/all";
    };
}

export class Request2 extends GenericService<IReturnType2> {
    urls: {
        getOne: "/url/for/request/2";
        getAll: "/url/for/request/2/all";
    };
}

@autoinject
export class ConsumerExample {
    constructor(
        private r1: Request1,
        private r2: Request2
    ) { }

    async getAllReturnType1() {
        const result = await this.r1.getAll();
    }

    async getOneReturnType2() {
        const result = await this.r2.getOne();
    }
}

从“aurelia框架”导入{autoinject}；
从“aurelia http客户端”导入{HttpClient}；
导出接口IReturnType1{
id：编号；
名称：字符串；
}
导出接口IReturnType2{
id：编号；
高度：弦；
重量：细绳；
}
导出接口IRequestUrls{
getOne:字符串；
getAll:string；
}
@自动注入
导出抽象类GenericService{
构造函数（私有http:HttpClient）{}
摘要URL:IRequestUrls；
getOne（）：承诺{
返回此文件。http
.get（this.url.getOne）
.然后（response=>response.content）；
}
getAll（）：承诺{
返回此文件。http
.get（this.url.getAll）
.然后（response=>response.content）；
}
}
导出类Request1扩展了GenericService{
网址：{
getOne:“/url/for/request/1”；
getAll:“/url/for/request/1/all”；
};
}
导出类Request2扩展了GenericService{
网址：{
getOne:“/url/for/request/2”；
getAll:“/url/for/request/2/all”；
};
}
@自动注入
导出类ConsumerExample{
建造师(
私有r1:Request1，
私人r2:Request2
) { }
异步getAllReturnType1（）{
const result=wait this.r1.getAll（）；
}
异步getOneReturnType2（）{
const result=wait this.r2.getOne（）；
}
}
下面是一个使用泛型和类型脚本的基本示例。接口应与api返回的json结构相匹配。希望这是有帮助的

import { autoinject } from "aurelia-framework";
import { HttpClient } from "aurelia-http-client";

export interface IReturnType1 {
    id: number;
    name: string;
}

export interface IReturnType2 {
    id: number;
    height: string;
    weight: string;
}

@autoinject
export class GenericService {
    constructor(private http: HttpClient) { }

    getOne<T>(url: string): Promise<T> {
        return this.http
            .get(url)
            .then(response => response.content);
    }

    getAll<T>(url: string): Promise<T[]> {
        return this.http
            .get(url)
            .then(response => response.content);
    }
}

@autoinject
export class ConsumerExample {
    constructor(private svc: GenericService) { }

    async getAllReturnType1(){
        const result = await this.svc.getAll<IReturnType1>("url/for/request/1");
    }

    async getOneReturnType2(){
        const result = await this.svc.getOne<IReturnType2>("url/for/request/2");
    }
}

从“aurelia框架”导入{autoinject}；
从“aurelia http客户端”导入{HttpClient}；
导出接口IReturnType1{
id：编号；
名称：字符串；
}
导出接口IReturnType2{
id：编号；
高度：弦；
重量：细绳；
}
@自动注入
导出类泛型服务{
构造函数（私有http:HttpClient）{}
getOne（url:string）：承诺{
返回此文件。http
.get（url）
.然后（response=>response.content）；
}
getAll（url:string）：承诺{
返回此文件。http
.get（url）
.然后（response=>response.content）；
}
}
@自动注入
导出类ConsumerExample{
构造函数（私有svc:GenericService）{}
异步getAllReturnType1（）{
const result=wait this.svc.getAll（“url/for/request/1”）；
}
异步getOneReturnType2（）{
const result=wait this.svc.getOne（“url/for/request/2”）；
}
}

继承示例

import { autoinject } from "aurelia-framework";
import { HttpClient } from "aurelia-http-client";

export interface IReturnType1 {
    id: number;
    name: string;
}

export interface IReturnType2 {
    id: number;
    height: string;
    weight: string;
}

export interface IRequestUrls {
    getOne: string;
    getAll: string;
}

@autoinject
export abstract class GenericService<T> {
    constructor(private http: HttpClient) { }

    abstract urls: IRequestUrls;

    getOne(): Promise<T> {
        return this.http
            .get(this.urls.getOne)
            .then(response => response.content);
    }

    getAll(): Promise<T[]> {
        return this.http
            .get(this.urls.getAll)
            .then(response => response.content);
    }
}

export class Request1 extends GenericService<IReturnType1> {
    urls: {
        getOne: "/url/for/request/1";
        getAll: "/url/for/request/1/all";
    };
}

export class Request2 extends GenericService<IReturnType2> {
    urls: {
        getOne: "/url/for/request/2";
        getAll: "/url/for/request/2/all";
    };
}

@autoinject
export class ConsumerExample {
    constructor(
        private r1: Request1,
        private r2: Request2
    ) { }

    async getAllReturnType1() {
        const result = await this.r1.getAll();
    }

    async getOneReturnType2() {
        const result = await this.r2.getOne();
    }
}

从“aurelia框架”导入{autoinject}；
从“aurelia http客户端”导入{HttpClient}；
导出接口IReturnType1{
id：编号；
名称：字符串；
}
导出接口IReturnType2{
id：编号；
高度：弦；