将formControlName与<span>

Question

我有一个动态表格，其中显示了我通过REST获得的多个数据集。用户将编辑此数据集，然后稍后将其提交以将其发送回服务器。

表单是FormBuilder.array()通过模板中的formArrayName+ 动态构建的，并通过+ 循环遍历*ngFor。

每个数据集的一个属性是我要与表单中的可编辑数据一起显示的“最新更新”信息。现在，我使用<input>具有disabled属性的字段-看起来有点难看。

当我使用模型驱动的表单时<span>{{mf.lastUpdated}}</span>，每个数据集都有一部分可以很好地显示日期。

现在，我想使用反应式表单，现在不能formControlName在<span>标签中进行设置-那么我应该如何在没有任何输入可能性的情况下显示信息？

编辑

柱塞：http ://plnkr.co/edit/JZIjXH9CagJNHLxK64fG?p=preview

“上次使用”字段-我想将其显示为“仅文本”，而没有输入标签

Answer 1

它以一个老问题为主题，但我面临着同样的问题

formControlName仅适用于输入，选择和文本区域。具有“值”属性的任何内容。

我设法使其直接在html中具有一个丑陋的解决方法

 {{ctrl.get("lastUpdated").value}}

• ctrl =是ngFor内部的AbstractControl迭代器，通常是* ngFor =“让FormArray.controls的ctrl；让ndx = index”

• lastUpdated =是您要显示的字段

Answer 2

无需解决方法的可能解决方案是将属性readonly用于输入，然后根据需要设置目标字段的样式（仅出于示例目的，下面为内联样式）。

 <div>
     <label>last used</label>
     <input type="text" formControlName="_lastUsed" readonly style="border:0">
</div>