- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
新:
所以我可以让它在没有 radio 组或没有正确绑定(bind)的情况下工作。我无法让它与两者一起工作。
这是允许的:
<div *ngFor="let column of row.controls.columns.controls; let j = index">
<ion-list radio-group [formControlName]="'col'+j">
<ion-radio></ion-radio>
</ion-list>
</div>
但是我没有包含 radio 组的列表,无论我更改什么,它总是会中断。如果我将列表移到它破坏的外部,请移动它破坏的 formControlName。我真的不知道如何让它发挥作用。
我认为这应该是要走的路:
<ion-list radio-group>
<div *ngFor="let column of columns; let j = index">
<div [formControlName]="'col'+j">
<ion-radio></ion-radio>
</div>
</div>
</ion-list>
但又是同样的错误:
Error: No value accessor for form control with path: 'rows -> 0 -> col0'
i = 我需要的行数。j = 我需要的选项/问题的数量。
旧:
我正在尝试将 ion-radio 用作表单组中的输入字段,但它一直给我错误:
No value accessor for form control with path ...
所以我切换到带有 type="radio"的输入,但如果我想将它们分组,我需要给它们相同的名称,但我不能这样做,因为我使用的是 *ngFor,否则我的 formControlName 是不再正确。
任何人都可以帮助我让 ionic radio 工作吗?它看起来更好,更容易分组。
<ion-col radio-group class="radioGroup" col-6>
<ion-col *ngFor="let column of columns; let j = index">
<input value="X" formControlName="col{{j + 1}}" type="radio" />
<!-- <ion-radio value="X"></ion-radio> -->
</ion-col>
</ion-col>
创作:
this.inspectionTableForm = this.formBuilder.group({
header: this.formBuilder.group({
title: [this.question.properties.header[0]],
columns: this.formBuilder.array([
this.formBuilder.control('')
]),
comments: ['']
}),
rows: this.formBuilder.array([
this.initRow()
])
});
private initRow() {
// Create the temp control
let tempControl = this.formBuilder.group({
title: '',
});
// Create an array for the columns
let arr = [];
for (let index = 0; index < this.question.properties["number-of-columns"]; index++) {
// Push a control to the array and also one for the value on a higher level
arr.push(this.columns[index])
tempControl.addControl(`col${index}`, this.formBuilder.control('')) // Col-1-2-3
};
tempControl.addControl('columns', this.formBuilder.array(arr)) //Array
// Check if we need to add the comment field
if (this.question.properties["comment-field"]) {
tempControl.addControl('comment', this.formBuilder.control(''))
}
return tempControl;
}
编辑半工作新代码(感谢 xrobert35):
<ion-col radio-group [formControlName]="'col'+i">
<ion-item *ngFor="let column of row.controls.columns.controls">
<ion-radio></ion-radio>
</ion-item>
</ion-col>
这是我按第一个选项、第二个和第三个选项时得到的结果:
它用一些奇怪的值更新同一个列。我认为问题在于我不需要 i 作为索引而是 j,但是当我这样做时它会中断。像这样:
<ion-col radio-group >
<ion-item *ngFor="let column of row.controls.columns.controls; let j = index" [formControlName]="'col'+j">
<ion-radio></ion-radio>
</ion-item>
</ion-col>
No value accessor for form control with path: 'rows -> 0 -> col0'
最佳答案
如果你有输入数组并且你使用响应式(Reactive)方法,最好在你的 FormGroup
中使用 FormArray
而不是使用这种方式。本文档将帮助您在您的代码中实现 FormGroup
: https://angular.io/api/forms/FormArray
关于angular - FormControlName 不适用于 ionic radio ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52333433/
我是一名优秀的程序员,十分优秀!