如何注入輔助類動態

我有一個使用了兩個輔助類中的一個，像一個組件：如何注入輔助類動態

import {HelperA} ... 
import {HelperB} ... 
... 

@Component({..}) 
export class MyComponent implements OnInit { 
    helper: Helper;  
    constructor(private ref: ElementRef, private device: MyDeviceDetectionService) {} 

    ngOnInit() { 
     if (this.device.isMobile) { 
      this.helper = new HelperA(this.ref); 
     } else { 
      this.helper = new HelperB(this.ref); 
     } 
    } 
}

我意識到，這是很難的單元測試，所以我怎麼能注入這些？理想情況下，我只需要其中一個，具體取決於isMobile是真是假。

來源

2017-08-27 Jeanluca Scaljeri

更新'HelperA'和'HelperB'的代碼 – Aravind

如何將他們重構爲基類？沒有注射，他們總是在那裏，等我的問題，你有什麼問題與測試？ – SayusiAndo

我不能嘲笑直接導入的類（據我所知） –

你可以將所有這些都推送到注射器。假設兩個幫手有一個共同的超類命名Helper，使用useFactory提供選項來創建無論你需要：

providers: [ 
    ..., 
    { provide: Helper, useFactory: createHelper, deps: [MyDeviceDetectionService, ElementRef] }, 
]

則工廠會是什麼樣子：

export function createHelper(device: MyDeviceDetectionService, ref: ElementRef): Helper { 
    if (device.isMobile) { 
    return new HelperA(ref); 
    } else { 
    return new HelperB(ref); 
    } 
}

注意，這將是在組件的提供程序數組中，因爲元素引用在模塊級別不可用。

來源

2017-08-27 11:00:23 jonrsharpe

最有可能的ElementRef值應該傳入工廠方法 –

我可以稍後傳遞元素ref（不是構造函數），這會使它更容易 –

@JeanlucaScaljeri是的，你可以有例如'this.helper.setRef（this.ref）;'在某些時候如果DI不起作用;如果你忘記在某個地方這樣做，那麼你將對象置於不可用狀態。 – jonrsharpe

如何注入輔助類動態

回答

相關問題