在 ngFor 中插入标签属性值总是会出现 "Got interpolation ({{}}) where expression was expected" 错误

Question

我正在使用 Devextreme's Datatable，我想通过列配置数组动态配置 table。

我们的想法是用 ngFor 迭代这个数组并动态设置列标签属性。

问题是：我们如何interpolate/inject/dinamically在ngFor中设置HTML属性的值？

这是我到目前为止尝试过的……

1) 尝试使用简单的字符串插值：

<dxi-column *ngFor="let col of columns" caption="{{col.caption}}" [visible]="{{col.show}}"></dxi-column>

但是我得到以下错误：

Got interpolation ({{}}) where expression was expected

2) 尝试使用 [attr.XXXX]={{}} 和字符串插值，所以我得到：

<dxi-column *ngFor="let col of columns" [attr.caption]="{{col.caption}}" [attr.visible]="{{col.show}}"></dxi-column>

但我总是得到以下错误：

Got interpolation ({{}}) where expression was expected

3) 进行了绝望、错误和糟糕的尝试……

<dxi-column *ngFor="let col of columns" [attr.caption]=col.caption [attr.visible]=col.show></dxi-column>

但是什么都没有，仍然没有用（这个尝试不太可能奏效，但是是一个非常绝望的尝试）。

仅供参考，这里还有我的测试配置数组，如果有兴趣：

  id: TableCol = {datafield:"id", show:"true" };
  desc: TableCol = {datafield:"idNodo", show:"showdesc"};

  columns: TableCol[] = [this.id, this.desc]

PS：如有需要，我会提供任何说明

Answer 1

你应该在使用输入语法时删除它，所以从可见中删除

<dxi-column *ngFor="let col of columns" caption="{{col.caption}}" [visible]="col.show"></dxi-column>

或

<dxi-column *ngFor="let col of columns" caption="{{col.caption}}" visible="{{col.show}}"></dxi-column>

Answer 2

你可以像以前那样做，或者使用括号：

<dxi-column *ngFor="let col of columns" [caption]="col.caption" [visible]="col.show"></dxi-column>

在 ngFor 中插入标签属性值总是会出现 "Got interpolation ({{}}) where expression was expected" 错误

Interpolating tags attribute values in a ngFor always gets "Got interpolation ({{}}) where expression was expected" error

typescript

devextreme

angular