Угловая проблема PatchValue с присвоением значения обратно группе - PullRequest
Новая
       7

Угловая проблема PatchValue с присвоением значения обратно группе

0 голосов
/ 26 сентября 2018

Я столкнулся с проблемой, когда попытался исправить значение для одного из элементов управления в группе форм.И это никогда не успех.Я использую Angular Material DatePicker с moment.js

Вот HTML: 

<form novalid  [formGroup]="desktopSearchForm">
      <div class="row-content" *ngIf="dateRange">
  <mat-form-field class="desktop-input">
    <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="mobileFromDate" placeholder="From" formControlName="startDate" (focusout)="dateParse(desktopSearchForm.get('startDate'))" />
    <mat-datepicker-toggle matSuffix [for]="mobileFromDate"></mat-datepicker-toggle>
    <mat-datepicker #mobileFromDate></mat-datepicker>
  </mat-form-field>
</div>
</form>

Вот функция, которую я вызываю (focusout) 

 this.desktopSearchForm = this.fb.group({
  classID: [''],
  startDate: [''], //This is the one I want to patch
  endDate: [''],
  transactionTypeID:['']
})

dateParse(control) {
if (control.value) {
  //control.value is a Moment.js Date object
  let group = <FormGroup>control.parent;
  let TheKey;
  Object.keys(group.controls).forEach(key => {
    let childControl = group.get(key);
    if (childControl === control) { // I found the Control I want to patch
      TheKey = key;                 
    }
  })
  group.patchValue({TheKey:control.value}) //I patch it here.

}

эта функция предназначена для автоматического присвоения правильного формата даты обратно полю ввода (на изображении есть много сборщиков дат с разными именами, такими как startDate, endDate и т. Д.).например, я набираю 25111988 в поле ввода, в то время как я фокусируюсь, значение ввода изменяется на «25/11/198».Но проблема в том, что control.value никогда не исправляет ключ, который правильно показывает startDate.

Но если я изменю его на это, и он будет работать: 

group.patchValue({startDate : control.value })

Также здесьДругая проблема:

, если я помещаю group.patchValue ({startDate: control.value}) в: 

Object.keys(group.controls).forEach(key => {
let childControl = group.get(key);
if (childControl === control) {
  group.patchValue({startDate : control.value })
}

})

Тогда это не работаетВот почему я поместил эту функцию патча за пределы forEach.

Нужна помощь.Большое спасибо.

1 Ответ

0 голосов
/ 26 сентября 2018

вам нужно привязать динамические клавиши там, где вы назначаете TheKey , и вы можете сделать это следующим образом,

Единственное изменение - {TheKey: control.value} {[TheKey]: control.value} 

dateParse(control) {
if (control.value) {
  //control.value is a Moment.js Date object
  let group = <FormGroup>control.parent;
  let TheKey;
  Object.keys(group.controls).forEach(key => {
    let childControl = group.get(key);
    if (childControl === control) { // I found the Control I want to patch
      TheKey = key;                 
    }
  })
  group.patchValue({[TheKey]:control.value}) //I patch it here.
}
...