在指令中手動獲取從注入器的依賴關係

Question

我想創建一個通用指令，它將採用類類型進行規則驗證，並根據類中的規則指令將顯示或隱藏元素。

這是我迄今的嘗試。

PLUNKER演示

myIf-Directive.ts

@Directive({ 
    selector: '[myIf]' 
}) 
export class MyIfDirective { 
    constructor(private _viewContainer: ViewContainerRef, 
    private _template: TemplateRef<Object>) 
    { } 

    @Input() set myIf(rule: string) { 
    //rule class type will come as string 
    //how can I use string token to get dependency from injector? 
    //currently harcoded 
    //will the injector create new instance or pass on instance from parent? 
    let injector = ReflectiveInjector.resolveAndCreate([AdminOnly]); 
    let adminOnly : IRule = injector.get(AdminOnly); 
    let show = adminOnly.shouldShowElement(); 
    show ? this.showItem() : this.hideItem(); 
    } 
    private showItem() { 
    this._viewContainer.createEmbeddedView(this._template); 
    } 

    private hideItem() { 
    this._viewContainer.clear(); 
    } 
} 

APP-component.ts

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div *myIf="'AdminOnly'"> 
     <h2>Hello {{name}}</h2> 
    </div> 
    `, 
}) 
export class App { 
    name:string; 
    constructor() { 
    this.name = 'Angular2' 
    } 
} 

但我被困在兩個地方：

1. 我不斷收到錯誤No Provider for AuthService
2. 我不知道我怎麼可以從注射器使用類名作爲字符串，而不是類型

任何建議，這是否是正確的方式來獲得的依賴做到這一點，或者我錯誤的地方是高度讚賞。

Answer 1

您需要通過父注射器狀

export class MyIfDirective { 
    constructor(private injector:Injector, private _viewContainer: ViewContainerRef, 
    private _template: TemplateRef<Object>) 
    { } 

    @Input() set myIf(rule: string) { 
    let resolvedProviders = ReflectiveInjector.resolve([AdminOnly]); 
    let childInjector = ReflectiveInjector.fromResolvedProviders(resolvedProviders, this.injector); 

    let adminOnly : IRule = childInjector.get(AdminOnly); 
    let show = adminOnly.shouldShowElement(); 
    show ? this.showItem() : this.hideItem(); 
    } 
    private showItem() { 
    this._viewContainer.createEmbeddedView(this._template); 
    } 

    private hideItem() { 
    this._viewContainer.clear(); 
    } 
} 

參見Inject service with ReflectiveInjector without specifying all classes in the dependency tree