Typescript:注入泛型并获取 ES6 模块名称

Typescript: Inject generic & get ES6 module name

本文关键字：ES6 模块 获取 注入 泛型 Typescript      更新时间：2023-09-26

我正在尝试使用以下方法构建一个通用存储库：

  • 打字稿
  • ES6
  • 角度 1.x

但是我不知道应该如何注入实体然后获取其模块名称。

我想取名的原因：是因为我遵循一种命名约定，其中一个名为 order-count.ts 的文件应该呈现 URL '/order/count'

这可以用打字稿/Javascript解决吗？

这是我所拥有的：

订单模块.ts 

import {App} from '../../App';
import {OrderService} from './order-service';
const module: ng.IModule = App.module('app.order', []);
module.service('orderService', OrderService);

订单服务网

import {CrudService} from '../../shared/services/crud-service'
import {OrderCount} from '../order/entities/order-count';
export class OrderService {
    // @ngInject
    constructor(private crudService: CrudService<OrderCount>) {
        this.crudService = crudService;
    }
    getOrders() {
        var promise = this.crudService.getAll();
        promise.then(response => {
            console.log(response, 'success');
        }, error => {
            console.log(error, 'failed');
        });
    }
}

订单计数.ts

import {Entity} from '../../../shared/models/entity';
export class OrderCount extends Entity {
    storeId: string;
    storeName: string;
}

实体.ts

export interface IEntity {
    id: number;
}

实体.ts

import {IEntity} from '../../module/contracts/entities/entity';
export class Entity implements IEntity {
    new() { }
    id: number;
}

crud-service.ts

'use strict';
import { Entity } from '../models/entity';
import { EndpointService } from './endpointService';
export class CrudService<TEntity extends Entity> {
    private baseCallPath: string;
    private entity: { new (): Entity };
    // @ngInject
    constructor(private endpointService: EndpointService, private $http: ng.IHttpService) {
        this.baseCallPath = new this.entity().constructor.name.replace('-', '/');
    }
    getAll(): ng.IHttpPromise<any> {
        return this.handleResponse(
            this.$http.get(this.endpointService.getUrl(this.baseCallPath)),
            'getAll'
        );
    }
    handleResponse(promise: ng.IHttpPromise<any>, callerMethodName: string): ng.IHttpPromise<any> {
        return promise.success((data: any) => {
            Array.prototype.push.apply(this.baseCallPath, data);
        }).error((reason: any) => {
            console.log(this.baseCallPath + callerMethodName, 'ERROR', reason);
        });
    }
}

endpoint-service.ts

export class EndpointService {
    private baseUri: string = 'http://localhost:3000/api/';
    getUrl(moduleName: string): string {
        return this.baseUri + moduleName;
    }
}

此链接可能有助于使用 Typescript 实现通用存储库

关于类名作为值的使用，您可以检查此相关问题。

好在它可以检索并用作Foo.name或this.constructor.name。不好的是，它并非在每个浏览器中都可用，应该进行多填充。另一个坏事是缩小的函数不会保存其原始名称。

用

Foo.name = 'Foo'来注释功能的定义并坚持使用预制属性不是很好吗？没有。 Function.name最初是不可配置的，因此它在大量浏览器中是只读的。

如果您根本不打算避免最小化，或者您不太喜欢配置 minifier 来保留类名(设计错误的解决方案(，请不要将 Function.name 用于类似的事情。

Angular 中可扩展 ES6/TS 类的典型情况是

export class Foo {
  static _name = 'Foo';
}
export default angular.module('app.foo', [])
  .factory('Foo', Foo)
  // if DRY is a must,
  // .factory(Foo._name, Foo)
  .name;

import { Foo } from './foo';
export class Bar extends Foo {
  static _name = 'Bar';
}
export default angular.module('app.bar', []).factory('Bar', Bar).name;

import moduleFoo from './foo';
import moduleBar from './bar';
angular.module('app', [moduleFoo, moduleBar]);

因此，Angular 模块和类的导出应该齐头并进，它们不可互换。

相关文章：