填寫這份《一分鐘調查》,幫我們(開發組)做得更好!去填寫Home

HostBinding

一個裝飾器,用於把一個 DOM 屬性標記為繫結到宿主的屬性,並提供配置元資料。 Angular 在變更檢測期間會自動檢查宿主屬性繫結,如果這個繫結變化了,它就會更新該指令所在的宿主元素。

Decorator that marks a DOM property as a host-binding property and supplies configuration metadata. Angular automatically checks host property bindings during change detection, and if a binding changes it updates the host element of the directive.

選項說明
hostPropertyName?

要繫結到資料屬性的 DOM 屬性。

The DOM property that is bound to a data property.

選項

要繫結到資料屬性的 DOM 屬性。

The DOM property that is bound to a data property.

      
      hostPropertyName?: string
    

使用說明

下面的例子建立了一個指令,它會對具有 ngModel 指令的 DOM 元素設定 validinvalid 屬性。

The following example creates a directive that sets the valid and invalid properties on the DOM element that has an ngModel directive on it.

      
      @Directive({selector: '[ngModel]'})
class NgModelStatus {
  constructor(public control: NgModel) {}
  @HostBinding('class.valid') get valid() { return this.control.valid; }
  @HostBinding('class.invalid') get invalid() { return this.control.invalid; }
}

@Component({
  selector: 'app',
  template: `<input [(ngModel)]="prop">`,
})
class App {
  prop;
}