我有一个 typescript 类如下:
export class ImageItem{
constructor(public Id: number, public ImageUrl: string, public Caption: string, public Description: string, private _sanitizer: DomSanitizer)
{
}
}
构造函数的所有参数都是与该类相关的属性,但最后一项是注入(inject)到我的类中的类。我的问题是,如果我想创建此类的对象,我想执行以下操作:
var a=new ImageItem(1, 'image1', 'http://aaa.com/aa.jpg', '')
但是由于注入(inject)的项目,它给了我一个错误。我想知道我应该如何解决这个问题。
最佳答案
您需要的是一个工厂服务,它能够创建此类的实例,同时注入(inject)您希望注入(inject)的属性。
它看起来像这样。
image-item.ts 定义了一个简单的类:
import { DomSanitizer } from '@angular/platform-browser';
export class ImageItem {
constructor(public Id: number, public ImageUrl: string, public Caption: string,
public Description: string, private _sanitizer: DomSanitizer) {
}
}
工厂是一个可注入(inject)的服务,它注入(inject)了 DomSanitizer 并且有一个方法能够创建 ImageItem 的实例。
import { Injectable } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { ImageItem } from './image-item';
@Injectable()
export class ImageItemFactoryService {
constructor(private domSanitizer: DomSanitizer) { }
public createImageItem(id: number, description: string) {
return new ImageItem(id, '', '', description, this.domSanitizer);
}
}
app.component.ts 导入工厂作为提供者并使用它来创建 ImageItem 的实例。
import { Component } from '@angular/core';
import { ImageItem } from './image-item';
import { ImageItemFactoryService } from './image-item-factory.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
providers: [ImageItemFactoryService]
})
export class AppComponent {
private item: ImageItem = null;
constructor(public imageItemFactory: ImageItemFactoryService) {
this.item = imageItemFactory.createImageItem(1, 'something');
}
}
在 angularjs(1) 中,可以使用注入(inject)器来创建实例,同时可以提供一些在注入(inject)期间使用的局部值。
但是在 Angular (2) 中 Injector 服务不再提供该功能。
关于angular - 具有多个参数和注入(inject)项的 TypeScript 构造函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45771196/