Angular 访问自定义组件中的formControlName
Inputtypeformtext是我们的自定义组件。此组件的用途是显示文本字段 当我在组件中拥有模板时,我能够看到值与字段绑定在一起Angular 访问自定义组件中的formControlName,angular,Angular,Inputtypeformtext是我们的自定义组件。此组件的用途是显示文本字段 当我在组件中拥有模板时,我能够看到值与字段绑定在一起 <input-type-form-text id="{{ question.value.questionId }}" [question]="question.value" [form]="section"> <input type="text" class="form-control" formControlName="is
<input-type-form-text id="{{ question.value.questionId }}" [question]="question.value"
[form]="section">
<input type="text" class="form-control" formControlName="isSelected"/>
<input-form-error></input-form-error>
</input-type-form-text>
如果移动内联模板并将其保留在自定义组件模板中,则无法将字段值添加到表单中
<input-type-form-text id="{{ question.value.questionId }}" [question]="question.value"
[form]="section">
</input-type-form-text>
在自定义组件模板中
<div class="screen-input-text-field dynamic-field form-group" [formGroup]="form">
<input type="text" class="form-control" formControlName="isSelected"/>
<input-form-error></input-form-error>
</div>
如何在自定义组件内访问或传递formControlName。
有人能帮上忙吗。为了在您自己的自定义组件中访问被动表单formcontrolname,您的自定义组件需要实现ControlValueAccessor接口
@Component({
selector: 'input-selectcontrol-form',
templateUrl: '',
styleUrls: [''],
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef(() => SelectFormControlComponent)
}
]
})
export class SelectFormControlComponent implements OnInit, ControlValueAccessor {
@Input() dropDownList;
constructor() {}
ngOnInit() {}
writeValue(value: any) {
if (value) {}
}
propagateChange(time: any) {
console.log(time);
}
registerOnChange(fn) {
this.propagateChange = fn;
}
registerOnTouched() {}
}
参考链接:
因为您要将formGroup向下传递给子组件,所以只需将formControl附加到formGroup,那么父组件应该能够通过formGroup获取form控件