答：不能，因為TypeScript的介面是設計時的， JavaScript沒有介面。 TypeScript程式碼​​從生成的JavaScript過程中消失。沒有任何介面型別資訊可供Angular在執行時查詢。

有兩個方案可以實現：

1、方案1： 最簡單的解決方案就是定義一個實現介面的抽象類。通常，無論如何你都需要一個抽象類。

定義介面：

import {Role} from "../../model/role";

export interface ProcessEngine {

     login(username: string, password: string):string;

     getRoles(): Role[];
}
 

抽象類：

import {ProcessEngine} from "./process-engine.interface";

export abstract class ProcessEngineService implements ProcessEngine {

    abstract login(username: string, password: string): string;

    abstract getRoles(): Role[];

}

實現類：

import { Injectable } from '@angular/core';
import {ProcessEngineService} from "./process-engine.service";

@Injectable()
export class WebRatioEngineService extends ProcessEngineService {

    login(username: string, password: string) : string {...}

    getRoles(): Role[] {...}

}
 

定義provider:

@NgModule({
      ...
      providers: [
        ...,
        {provide: ProcessEngineService, useClass: WebRatioEngineService}
      ]
})

2、方案2：Angular的官方文件建議使用InjectionToken，類似於OpaqueToken。

Your interface and class:

export interface AppConfig {
   apiEndpoint: string;
   title: string;
}

export const HERO_DI_CONFIG: AppConfig = {
  apiEndpoint: 'api.heroes.com',
  title: 'Dependency Injection'
};
 

Define your Token:

import { InjectionToken } from '@angular/core';

export let APP_CONFIG = new InjectionToken<AppConfig>('app.config');

使用InjectionToken物件註冊依賴項提供程式

providers: [{ provide: APP_CONFIG, useValue: HERO_DI_CONFIG }]

你可以通過@Inject裝飾器將配置物件注入任何需要它的建構函式中：

constructor(@Inject(APP_CONFIG) config: AppConfig) {
     this.title = config.title;
}