Угловое копирование строки таблицы

#javascript #html #angular #typescript

Вопрос:

Вот мой код. В моем коде я разрешаю пользователю создавать строку с теми же значениями, когда он нажимает кнопку рядом со строкой. Я хочу, чтобы он мог создавать несколько копий. Без цикла for я могу создать только одну строку, но с циклом for мне не удалось создать несколько копий. Чего не хватает в моем коде? Что мне делать?

 copyWorkItem(index: any, row: IWorkItem, event: any) {
        const dialogRef = this._dialog.open(CopyDialogComponent, {
            width: "550px",
            data: row,
        });


        dialogRef.afterClosed().subscribe((result: IWorkItemSelection) => {

             for(let i= 1; i >= result.CopyQuantity; i  ){

                let item: IWorkItem = {
                    Product: row.Product,
                    ProductCategory: row.ProductCategory,
                    Version: row.Version,
                    ProductBalance: row.ProductBalance,
                    DeliveryWarehouse: row.DeliveryWarehouse,
                }
    
                if (result.OrderIdCheck == null || result.OrderIdCheck == false) {
                    item.Order = null;
                }
                if(result.StockCheck == null || result.StockCheck == false || result.StockCheck == undefined){
                    item.ProductCategory = null;
                    item.Product = null;
                }
                if (result.VersionCheck == null || result.VersionCheck == false) {
                    item.Version = null;
                }
                if (result.DeliveryWarehouseCheck == null || result.DeliveryWarehouseCheck == false) {
                    item.DeliveryWarehouse = null;
                }
                if (result.QuantityCheck == null || result.QuantityCheck == false) {
                    item.Quantity = null;
                }


               //creates a new row
                let tempData = this.dataSource.data.splice(0);
                tempData.unshift(item);
                this.dataSource = new MatTableDataSource(tempData);
                this.EditIndex = 0;
    
             }
        });   
    }
 

Ответ №1:

Если вы хотите сгенерировать определенное количество html-элементов на основе качества копирования результатов диалога, я бы рекомендовал записать копии в массив объектов, а затем использовать директиву ngFor Angular для отображения этих элементов в таблице.

Комментарии:

1. Функция запускается с помощью этого кода; <button mat-icon-button *ngIf="userRights.CanChangeWorkItem amp;amp; isInEditableState" (click)="copyWorkItem(i, row, $event)"> <mat-icon>file_copy</mat-icon> </button> Я не знаю, где бы я использовал директиву ngFor.