JHipster 4.14.1:输入类型=“datetime-local”不绑定

时间:2018-05-27 13:10:14

标签: angular datetime angular5 jhipster

JHipster-Angular5 app中的双向数据绑定不应该支持input type =“datetime-local”吗?

我在JHipster 4.14.1生成的app中有这个简单的实体,使用Angular 5:

entity Product{
    Name String required,
    Description String maxlength(2000),
    Created ZonedDateTime,
    Modified ZonedDateTime
}

这是生成的表单:

<form name="editForm" role="form" novalidate (ngSubmit)="save()" #editForm="ngForm">

        <div class="modal-header">
            <h4 class="modal-title" id="myProductLabel" jhiTranslate="App.Product.home.createOrEditLabel">Create or edit a Product</h4>
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"
                    (click)="clear()">&times;</button>
        </div>
        <div class="modal-body">
            <jhi-alert-error></jhi-alert-error>
            <div class="form-group" [hidden]="!Product.id">
                <label for="id" jhiTranslate="global.field.id">ID</label>
                <input type="text" class="form-control" id="id" name="id"
                       [(ngModel)]="Product.id" readonly />
            </div>
            <div class="form-group">
                <label class="form-control-label" jhiTranslate="App.Product.name" for="field_name">Name</label>
                <input type="text" class="form-control" name="name" id="field_name"
                    [(ngModel)]="Product.name" required/>
                <div [hidden]="!(editForm.controls.name?.dirty && editForm.controls.name?.invalid)">
                    <small class="form-text text-danger"
                       [hidden]="!editForm.controls.name?.errors?.required" jhiTranslate="entity.validation.required">
                       This field is required.
                    </small>
                </div>
            </div>
            <div class="form-group">
                <label class="form-control-label" jhiTranslate="App.Product.description" for="field_description">Description</label>
                <input type="text" class="form-control" name="description" id="field_description"
                    [(ngModel)]="Product.description" maxlength="2000"/>
                <div [hidden]="!(editForm.controls.description?.dirty && editForm.controls.description?.invalid)">
                    <small class="form-text text-danger"
                       [hidden]="!editForm.controls.description?.errors?.maxlength" jhiTranslate="entity.validation.maxlength" translateValues="{ max: 2000 }">
                       This field cannot be longer than 2000 characters.
                    </small>
                </div>
            </div>
            <div class="form-group">
                <label class="form-control-label" jhiTranslate="App.Product.created" for="field_created">Created</label>
                <div class="d-flex">
                    <input id="field_created" type="datetime-local" class="form-control" name="created" [(ngModel)]="Product.created"
                    />
                </div>
            </div>
            <div class="form-group">
                <label class="form-control-label" jhiTranslate="App.Product.modified" for="field_modified">Modified</label>
                <div class="d-flex">
                    <input id="field_modified" type="datetime-local" class="form-control" name="modified" [(ngModel)]="Product.modified"
                    />
                </div>
            </div>
            <div class="form-group">
                <label class="form-control-label" jhiTranslate="App.Product.type" for="field_type">Type</label>
                <select class="form-control" name="type" [(ngModel)]="Product.type" id="field_type" >
                    <option value="IT">{{'App.ProductType.INFORMATION' | translate}}</option>
                    <option value="HEALTHCARE">{{'App.ProductType.HEALTHCARE' | translate}}</option>
                </select>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="clear()">
                <span class="fa fa-ban"></span>&nbsp;<span jhiTranslate="entity.action.cancel">Cancel</span>
            </button>
            <button type="submit" [disabled]="editForm.form.invalid || isSaving" class="btn btn-primary">
                <span class="fa fa-save"></span>&nbsp;<span jhiTranslate="entity.action.save">Save</span>
            </button>
        </div>
    </form>

但是,当我尝试保存产品时,创建和修改的字段在POST调用中作为null传递。

{  
   "name":"Product",
   "description":"Product Description",
   "created":null,
   "modified":null,
   "type":"IT"
}

我该如何解决这个问题?

0 个答案:

没有答案