創作角度指令

繼輸入的使用是對角文檔給出屬性指令的指令例如 https://angular.io/guide/attribute-directives 創作角度指令

import { Directive, ElementRef, Input } from '@angular/core'; 
@Directive({ selector: '[myHighlight]' }) 
export class HighlightDirective { 
    constructor(el: ElementRef) { 
     el.nativeElement.style.backgroundColor = 'yellow'; 
    } 
}

它下面，他們與下面的文本

的解釋import語句指定來自Angular核心的符號：
指令提供了@Directi的功能裝飾者。
ElementRef注入指令的構造函數，以便代碼可以訪問DOM元素。
輸入允許數據從綁定表達式流入指令。

我不清楚第四點，他們說輸入允許數據從綁定表達式流入指令，但是在沒有使用輸入的類中，那麼Angular如何使用它，因爲之前我讀過在NgModule文檔中，上面的import語句與angular不相關

所以我的理解是每當Angular遇到屬性指令時，它都會使用類HighlightDirective創建一個對象，但由於它沒有任何對Input的引用，它如何從綁定表達式獲得數據流

因此我的理解是，因爲我們不是acc在這裏查看數據，我們不需要在頂部導入輸入模塊

來源

2017-09-06 Akshay Vijay Jain

的HighlightDirective指令不具有@Input()

如果你看一下*ngIf指令的來源應該變得更加清晰

@Directive({selector: '[ngIf]'}) 
export class NgIf { 
    ... 

    constructor(private _viewContainer: ViewContainerRef, templateRef: TemplateRef<NgIfContext>) { 
    this._thenTemplateRef = templateRef; 
    } 

    @Input() 
    set ngIf(condition: any) { 
    this._context.$implicit = this._context.ngIf = condition; 
    this._updateView(); 
    }

該指令確實有一個輸入，並且我假設你熟悉它的使用

<div *ngIf="isVisible"

其中isVisible值傳遞給@Input() ngIf;（在這種情況下，二傳手，但我離開了，因爲在一般它只是一個字段，而不是一個setter）

來源

2017-09-06 08:14:42

所以基本上，我明白，因爲高亮指令中沒有設置方法，所以我們不需要導入Input，但Input需要在NgIf中導入，因爲它有一個set方法這需要輸入模塊 –

準確。 Input是在一些打字稿文件中聲明的一個標識符，爲了使它在當前文件中被識別，它需要一個打字稿導入。這種導入的要求與Angular完全無關，這是一個打字稿的基本要求，即使用標識符需要從聲明的地方導入。這允許從不同的文件（不同的包）中消除具有相同名稱的標識符的歧義， –

對於此指令，您不需要使用Input，因爲它放置在元素上，並且我們通過將指令置於頂部來獲取元素的所有屬性然後直接修改元素的顏色。

但是，一旦您需要將值傳遞給指令，您將需要使用@Input。例如用於在旅途中動態地傳遞背景顏色。

請參閱使用進口的輸入工作的例子

來源

2017-09-06 08:09:37

創作角度指令

回答

相關問題