angular - TypeScript 構造函數具有多個參數和注入項目

我有一個 TypeScript 類如下：

export class ImageItem{
    constructor(public Id: number, public ImageUrl: string, public Caption: string, public Description: string, private _sanitizer: DomSanitizer)
    {
    }
}

所有建構子的參數都是與該類別相關的屬性，但最後一個項目是一個注入到我的類別中的類別。我的問題是，如果我想創建該類別的物件，我想像下面這樣做：

var a=new ImageItem(1, 'image1', 'http://aaa.com/aa.jpg', '')

但是它因為注入的項目而給我一個錯誤。我在想我應該如何解決這個問題。

答案＃1

你需要的是一個工廠服務，它能夠創建這種類別的實例，同時注入你希望被注入的屬性。

它看起來會像這樣。

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) {
    }
}

該工廠是一個可注入的服務，會注入 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) 中，可以使用注入器來創建一個實例，同時也可以提供一些在注入過程中使用的本地值。

然而，在 Angular (2) 中，Injector 服務不再提供該功能。