如何检测主机元素属性的变化?

时间:2020-05-14 14:36:34

标签: javascript angular dom kendo-grid kendo-angular-ui

我试图根据指令设置的属性更改组件内部复选框的状态。我的情况是更改复选框的状态,例如在单击表行时不单击my-checkbox元素。

<kendo-grid-checkbox-column>
  <ng-template kendoGridCellTemplate let-idx="rowIndex">
    <form [formGroup]="getColumnCheckboxFormGroup()">
      <my-checkbox [kendoGridSelectionCheckbox]="idx" formControlName="columnCheckbox">
      </my-checkbox>
    </form>
  </ng-template>
</kendo-grid-checkbox-column>

当我单击表格行时,指令kendoGridSelectionCheckbox正确设置了元素checked的属性my-checkbox,这要感谢这一行:

this.renderer.setProperty(this.el.nativeElement, "checked", this.selectionService.isSelected(this.itemIndex));

在我的复选框组件中,可通过以下行使用此属性的值:

this.elementRef.nativeElement.checked // work fine, have current value 

我想要的是检测主机属性checked何时发生更改并执行函数setValue()来更改自定义控件的值。

不幸的是,以下代码无法按我预期的方式工作:

@Input() checked: boolean;

还尝试绑定到属性,但是也失败:

@HostBinding('checked') get checked() {
  return this.control.value;
}

由于:

无法绑定到“已选中”,因为它不是“我的复选框”的已知属性。

0 个答案:

没有答案