在Angular中注入通用服务

发布时间：2020-12-17 07:30:45 所属栏目：安全来源：网络整理

导读：如果使用不同的类型跨组件构造函数调用Angular,它会注入一个以上的通用服务实例吗？我有很多服务会为不同的类提供相同的功能,这些类都继承自同一个基类.我想使用Typescript的通用模式MyService T extends BaseClass处理这个. 但是我不知道它是如何与Angular

如果使用不同的类型跨组件构造函数调用Angular,它会注入一个以上的通用服务实例吗？

我有很多服务会为不同的类提供相同的功能,这些类都继承自同一个基类.我想使用Typescript的通用模式MyService< T extends BaseClass>处理这个.

但是我不知道它是如何与Angular的注射器混在一起的：

>如果将Angular注入器注入具有不同类型的不同组件,它是否会创建多个此服务实例？
>如果使用相同的类型调用它,注入器是否会注入相同的实例？

码：

@Injectable
export class MyService<T> {
    ...
}

@Component
export class ComponentA {
    constructor(alphaService MyService<Alpha>) {}   <--Instance 1
}

@Component
export class ComponentB {
    constructor(betaService MyService<Beta>) {}   <----Instance 2?
}

@Component
export class ComponentA1 {
    constructor(alphaService MyService<Alpha>) {}  <---Instance 1?
}

这合法吗？注射器是否知道创建两个MyService实例？

这是一个简单的解决方案：

// service and models
export class User{
    firstName:string
}
export class Admin{
    lastName:string
}

@Injectable()
export class GenericService<T>{
    item:number = Math.random();
    GetAll():Array<T> {
        let output = [];
        console.log(this.item); // each instance has own value
        return output;
    }
}

然后通过useFactory在模块中设置您的服务：

providers: [
        {provide:'UserService',useFactory:()=>(new GenericService<User>())},{provide:'AdminService',useFactory:()=>(new GenericService<Admin>())},],

并使用@Inject装饰器注入您的服务：

constructor(@Inject('UserService') private userService:GenericService<User>,@Inject('AdminService') private adminService:GenericService<Admin>
    ) { }

请记住,最好为您的提供者令牌使用InjectionToken(OpaqueToken已弃用).为了简单起见,我使用了字符串.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!