如何使用動態名稱創建Angular 2自定義屬性指令？

Question

我想創建自定義以同樣的方式它是如何爲內置指令一樣使用本例中「ATTR」，「類」，「風格」屬性來完成指令：

<div [style.width.px]="mySize"> 

文檔here只描述具有固定指令名稱的情況。所以問題是：

1. 我該如何指定這樣的指令選擇器？

2. 如何檢索指令名稱的變量部分？

或者可能根本不可能，只用於內置指令？

Answer 1

雖然在@Günter檢查下幾乎不可能做到這一點。

---

                                                                                                                                      PLUNKER ⇗

但如果你只是想幾乎同樣適用於style指令，這可能會幫助你。

用法：

<h2 [customStyle]="['width.px', mysize]" >Hello {{name}}</h2> 

自定義指令：

@Directive({ 
    selector: '[customStyle]', 
    inputs: ['style:customStyle'] 
}) 
export class CustomDir{ 
    style; 
    constructor(private elRef: ElementRef){ 
    } 

    ngAfterViewInit(){ 
    if(this.style){ 
     const prop = this.style[0].split('.')[0]; 
     const unit = this.style[0].split('.')[1]; 
     const val = this.style[1]; 

     this.elRef.nativeElement.style[prop] = val + (unit || ''); 
    } 
    } 
} 

Answer 2

據我所知，這不被支持，也沒有計劃。

或者可能根本不可能，只能用於內置指令？

此語法與指令無關，它是內置的綁定語法。