Как избежать повторения одного и того же значения в formcontrolname с помощью angular8 - PullRequest
Новая
       5

Как избежать повторения одного и того же значения в formcontrolname с помощью angular8

0 голосов
/ 01 апреля 2020

Я использовал formArray для l oop значений и при выборе одного элемента мы можем перемещаться вправо и влево в зависимости от того, какую сторону мы выбрали. Вот, я выбираю последний элемент справа и перемещаюсь влево, затем Я выбираю последний, но один и перемещаю его влево. Затем пришло дублированное значение. Я думаю, что это связано с несоответствием значения индекса. Я не могу исправить эту проблему. Может ли кто-нибудь помочь мне решить эту проблему.

DEMO: Рабочая демоверсия

HTML: 

<div class="card-body overflow-auto py-0" formArrayName="agentNotGroupView">
                  <div class="swap-list-item" *ngFor="let items of agentNotinView; let i = index" [formGroupName]="i"
                    [class.selected]="selected2.includes(items)">
                    <input formControlName="agentNotInViewValue" [readOnly]="true" (click)="onSelect(2, items)" [disabled] = "isReadOnly"/>
                  </div>
                </div>

TS: 

    this.agentNotInViewArray = this.FB.array(
            this.agentNotinView.map(x => this.FB.group({
              agentNotInViewValue: this.FB.control(x.value)
            }))
          );

          this.agentGroupNotViewInfoForm = this.FB.group({
            agentNotGroupView: this.agentNotInViewArray
          })

move from one button to other:
moveFrom(fromListNumber: number) {
    const selected: MyInterface[] = this.getSelected(fromListNumber);
    if (selected.length === 0) {
      return;
    }

    const toListNumber: number = fromListNumber === 1 ? 2 : 1;

    const fromModel: MyInterface[] = this.getModel(fromListNumber);
    const fromFormArray: FormArray = this.getFormArray(fromListNumber);

    const toModel: MyInterface[] = this.getModel(toListNumber);
    const toFormArray: FormArray = this.getFormArray(toListNumber);

    // remove items and form groups    
    selected.forEach((item) => {
      const index: number = fromModel.indexOf(item);
      const formGroup: FormGroup = fromFormArray.controls[index] as FormGroup;

      // remove from model
      fromModel.splice(index, 1);
      // remove from from array
      fromFormArray.removeAt(index);

      // add to form array
      toFormArray.push(formGroup);
      // add item to model
      toModel.push(item);
    });
    // clear selected
    selected.length = 0;
  this.groupInfoForm();
  this.notGroupInfoForm();
    }

Согласно моей отладке, items.value и items.id работают нормально, но formcontrolName выдает дублирующее значение. нужна помощь, чтобы исправить это.

1 Ответ

0 голосов
/ 02 апреля 2020

Я смог решить эту проблему, добавив условие if ans else при повторном вызове формы, так что это было так.

TS: 

moveFrom(fromListNumber: number) {
    const selected: MyInterface[] = this.getSelected(fromListNumber);
    if (selected.length === 0) {
      return;
    }

    const toListNumber: number = fromListNumber === 1 ? 2 : 1;

    const fromModel: MyInterface[] = this.getModel(fromListNumber);
    const fromFormArray: FormArray = this.getFormArray(fromListNumber);

    const toModel: MyInterface[] = this.getModel(toListNumber);
    const toFormArray: FormArray = this.getFormArray(toListNumber);

    // remove items and form groups    
    selected.forEach((item) => {
      const index: number = fromModel.indexOf(item);
      const formGroup: FormGroup = fromFormArray.controls[index] as FormGroup;

      // remove from model
      fromModel.splice(index, 1);
      // remove from from array
      fromFormArray.removeAt(index);

      // add to form array
      toFormArray.push(formGroup);
      // add item to model
      toModel.push(item);
    });
    // clear selected
    selected.length = 0;
    if(fromListNumber == 2) {
  this.groupInfoForm();
    } else if(fromListNumber == 1) {
  this.notGroupInfoForm();
    }
    }
...