Question

我正在创建角形的反应形式。我有一个定义formLabel的模型。我想在表单中使用其预定义的类型和源值作为下拉菜单

我的模特看起来像这样

export interface FormLabel {
  name?: string;
  type?: 'input' | 'input-h' | 'textarea' | 'slider' | 'select' | 'select-h' | 'multiselect' | 'multiselect-h' | 'date';
  created_by?: number;
  source: '1' | '2' | '1e' | '2m';
}

我要使用的组件形式是

import {FormLabel} from '../../models/label';


@Component({
  selector: 'app-edit-attribute',
  templateUrl: './edit-attribute.component.html',
})
export class EditAttributeComponent implements OnInit {
  attributeEditForm: FormGroup


  constructor(
    public dialogRef: MatDialogRef<EditAttributeComponent>,
    @Inject(MAT_DIALOG_DATA) public data: FormLabel) {}
  ngOnInit(): void {
    this.attributeEditForm = new FormGroup({
      'name': new FormControl(this.data.name, Validators.required),
      'type': new FormControl(this.data.type),
      'source': new FormControl(this.data.data_source),
    });
  }

我要显示类型和来源值的html文件是

<form [formGroup]="attributeEditForm" (ngSubmit)="onSubmit()">
    <input type="text" id="1" formControlName="attribute_name">
    <input type="text" id="2" formControlName="attribute_type">
    <input type="text" id="3" formControlName="source">
    <button type="submit">Submit</button>

  </form>

我正在尝试在组件中使用模型值来创建表单

0 个答案: