@input的angular 2數據綁定模板

Question

我很想知道你們如何轉換綁定數據輸入

template: `<guage-bar [guage]=guageBar></guage-bar>`

做這樣的事情

let data = new PercentValue(20, 100); 
let guageBar = new GuageBar(this.data,'Database Health');

GuageBarComponent.guage = this.guageBar;

我試過這個並沒有用。 我的最終目標是嘗試使用服務在另一個類中進行輸入屬性值。

謝謝！

Answer 1

您可以使用@ViewChild並使用生命周期鈎子ngAfterViewInit來設置值

import { ViewChild, AfterViewInit } from '@angular/core'

@Component({
  template: `<guage-bar></guage-bar>`
})
class ParentComponent implements AfterViewInit {

  @ViewChild(GuageBarComponent) guageBarCmp: GuageBarComponent;

  // the child component is available when this is called.
  // before that it will be null
  ngAfterViewInit() {
    guageBarCmp.guageBar = guageBar;
  }
}