противоречие в изменении значения поля формы двухсторонней передачи данных - PullRequest
0 голосов
/ 23 января 2019

Я пытаюсь сделать такую ​​форму.

https://ibb.co/pyChmz4

Всякий раз, когда я хочу добавить новый элемент, который можно редактировать позже, в форме ввода появляется выше, все количество элементов устанавливается на то же число, что и в последнем добавленном. Хотя они разные, как можно видеть в JSON.

Код выглядит следующим образом. «OrderItems» поставляется компонентом.

Где я делаю не так?

 <div class="h-100 v-100 border rounded" style="background-color:#FFEBEE">
        <p class="text-black-50 m-2 font-weight-bolder">items to be added</p>
        <div class="item-flex-container m-2 p-2" name="orderItemList" *ngFor="let orderitem of orderItems">

          <mat-form-field class="col-6">
            <mat-select placeholder="Item description" name="item" [(value)]="orderitem.item.id" (selectionChange)="changeItem(orderitem)">
              <mat-option *ngFor="let item of items" [value]="item.id" name="itemid">{{item.description}}</mat-option>
            </mat-select>
          </mat-form-field>
          <mat-form-field class="input-number">
          <input matInput placeholder="number of items" name="numberofItem" type="number" [(ngModel)]="orderitem.number">
          </mat-form-field>
          <div class="add-button">
            <a style="font-size: 15px; font-weight: 200;" color="warn" mat-mini-fab matTooltip="change"><i class="fa fa-ellipsis-v"
                aria-hidden="true"></i>
            </a>
          </div>
        </div>
      </div>

      <div class="item-flex-container m-2 mt-5">
        <mat-form-field class="col-6">
          <mat-select name="item" placeholder="Item description" [(ngModel)]="form.itemid">
            <mat-option *ngFor="let item of items" value="{{item.id}}" name="item">{{item.description}}</mat-option>
          </mat-select>
        </mat-form-field>
        <mat-form-field class="input-number">
          <input matInput placeholder="number of items" type="number" name="numberItemAdd" [(ngModel)]="form.numberItemAdd">
        </mat-form-field>
        <div class="add-button">
          <a style="font-size: 30px; font-weight: 500;" color="warn" (click)="add(form.itemid)" mat-mini-fab
            matTooltip="Add new Item">+
          </a>
        </div>
...