使用ngx-bootstrap datepicker的正确方法是什么?

时间:2017-09-01 08:47:42

标签: angular ngx-bootstrap

我想要渲染一组“场”对象。当field.type是date时,我想渲染一个ngx-bootstrap / datepicker字段。我的日期字段的JSON对象如下所示:

{
"field": {
  "name": "date_of_occurrence",
  "label": "Date of occurrence",
  "valueType": "date",
  "type": "custom",
  "settings": {
     "required": false
  },
  "organisation": 1,
 },
 "size": 4
}

我试图像这样呈现:

<form *ngIf="complexForm" name="form" (ngSubmit)="complexForm.valid && send()" [formGroup]="complexForm" novalidate>

<div *ngIf="fieldValue.field.valueType == 'date'" class="form-group">
    <label>{{fieldValue.field.label}}:</label>
    <div class="input-group">
        <input [required]="fieldValue.field.settings.required" type="text" id="complexForm.controls[fieldValue.field.name]" class="form-control date-input" bsDatepicker [(ngModel)]="fieldValue.value">
        <label for="complexForm.controls[fieldValue.field.name]" class="input-group-btn btn btn-primary" (click)="dp.toggle()"><i class="fa fa-calendar" aria-hidden="true"></i></label>
        <span style="display: inline-block">                
            <datepicker #dp [(ngModel)]="fieldValue.value" style="display: block"></datepicker>
        </span>
    </div>
</div>

</form>

但是我收到了这个错误:

  

ngModel不能用于向父级注册表单控件   formGroup指令。尝试使用         而是formGroup的合作伙伴指令“formControlName”。

我看到datepicker示例使用“bsValue”来绑定,但我不想要硬编码,因为我的组件简单渲染数组中的任何“字段”,并且应该将值绑定回值的属性阵列。直到第一次保存值属性不存在。

我做错了什么?

0 个答案:

没有答案