【问题标题】:too much glue in angular2 DI or there is another way?angular2 DI 中的胶水过多还是有其他方法?
【发布时间】:2016-06-11 11:24:23
【问题描述】:

在 Angular 1.x 中,服务是通过指定其注册名称来注入的。例如使用 TypeScript:

// appointments.ts
export interface IAppointmentServices {
    retrieve(start: Date, end: Date): Appointment[]
}

// appointment-services.ts:
class AppointmentServices implements IAppointmentServices {
     retrieve(start: Date, end: Date): Appointment[] {
          ...
     }
}

angular.module('appointments')
       .service('AppointmentServices', AppointmentServices);

// appointment-controller.ts
class AppointmentController {
     constructor (private service: IAppointmentService) {
     }
     // pay attention that 'AppointmentServices' is the registered name
     // not a hard reference to the class AppointmentServices
     static $inject = ['AppointmentServices'] 
}

请注意,控制器实现不以任何方式引用文件或实现服务的类

但在角度 2 中,要完成类似的 DI,您必须执行以下操作:

import {Component} from 'angular2/core';
import {AppointmentServices} from 'appointment-services';

@Component({
    ...
    providers: [AppointmentServices]
})
export class Appointment {
    constructor (service: AppointmentServices) {
        ...
    }
}

请注意,在上面的第二次导入中,我必须指定 AppointmentServices 的实现位置以及代表 组件与服务实现之间的粘合剂的类的名称>

angular2有没有办法在不指定类和实现它的文件的情况下注入服务?

如果 DI 必须以这种方式完成,我认为这种 angular2 方法在其前身中完成的 IoC 方面是一种倒退!

【问题讨论】:

    标签: angular angular2-di


    【解决方案1】:

    没有这样的方法,因为这就是import / export 功能的工作原理。为了import 某个东西,它必须同样是exported(同名),在其他地方。

    因此为什么在一个文件(约会服务)中你有

    export class AppointmentServices
    

    你使用对象破坏来“抓取”那个特定的东西(从它导出的)的另一个组件文件

    import { AppointmentServices } from 'appointment-services';
    

    这两者是相互联系的,这就是它们相互访问的方式。尽管这可能看起来“倒退”,但 TypeScript 和 IDE 现在有能力轻松重构整个库,因为它们知道这些导出/导入。

    因此,如果您想将其更改为 export class AnotherAppoinmentService,则可以对其进行重构,您的 IDE 可以自动为您切换它们!

    注意:Angular1 模块将所有内容都存储为“字符串”,这就是松散指定的原因。例如,您通常必须执行 MyClass.name

    【讨论】:

    • 不错的答案 :) 这也允许区分具有相同名称的两个服务(来自不同的库)以避免意外冲突。它还允许适当的 tree-shaking,因为它可以跟踪标识符的来源。未导入的库已知未使用,可以跳过。 Angular1 方式是典型的 JS 方式,您需要希望您不要忘记一致地命名某些东西。在 TypeScript 中,工具可以提供很多指导,但它们需要明确的信息。
    • 我仍然认为这太多了,在 IoC 方面倒退了一步。看看inversify.io,这是我真正想要的。这是一种真正的 IoC 方法,因为 angular2 中组件和服务之间的硬依赖并不方便
    猜你喜欢
    • 1970-01-01
    • 2022-03-07
    • 2023-03-08
    • 2023-02-20
    • 1970-01-01
    • 2010-11-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多