Угловой Вход Исчезает После Нажатия Готово

#javascript #html #angular #typescript

Вопрос:

В моем приложении у меня есть таблица, в которой пользователь может ввести некоторые свойства. Код работает нормально, и пользователь может ввести и сохранить то, что он ввел. Но когда он нажимает кнопку «Изменить», поле » Имя » становится пустым. Но имя все еще там после выхода из режима редактирования, имя возвращается снова. Я не получаю никаких ошибок, но я не знаю, почему это происходит. Вот мой код, что я должен исправить? введите описание изображения здесь введите описание изображения здесь

HTML:

 lt;ng-container matColumnDef="Product"gt;  lt;th mat-header-cell *matHeaderCellDefgt; Malzeme/Hizmet/Ürünlt;/thgt;  lt;td *matCellDef="let row; let i = index"gt;  lt;span *ngIf="EditIndex != i" class="pl-4 pr-4"gt;{{row.Product?.ProductName}}lt;/spangt;  lt;mat-form-field floatLabel="never" *ngIf="EditIndex == i" class="w-100-p" style="min-width: 800px !important;"gt;  lt;input type="text" required matInput name="Product" style="min-width: 800px !important;"  (input)="onSearchChange($event.target.value, row.ProductCategory?.ProductCategoryId)"  [value]="row.Product?.ProductName" [(ngModel)]="row.Product.ProductName"  (ngModelChange)="updateWorkItemProductName($event, row)" [matAutocomplete]="autoProduct"gt;  lt;mat-autocomplete autoActiveFirstOption #autoProduct="matAutocomplete"  [displayWith]="displayProduct.bind(this)"gt;  lt;mat-option *ngFor="let prm of products" [value]="prm.ProductId"gt;  {{prm.StockIntegrationCode}} - {{prm.ProductName}} - {{prm.Version}}  lt;/mat-optiongt;  lt;/mat-autocompletegt;  lt;/mat-form-fieldgt;  lt;/tdgt;  lt;/ng-containergt;  lt;button mat-icon-button *ngIf="userRights.CanChangeWorkItem amp;amp; isInEditableState amp;amp; EditIndex != i"  (click)="editRow(row, i)"gt;  lt;mat-icongt;editlt;/mat-icongt;  lt;/buttongt;  lt;button mat-icon-button *ngIf="userRights.CanChangeWorkItem amp;amp; isInEditableState amp;amp; EditIndex == i"  (click)="editRow(row, undefined)"gt;  lt;mat-icongt;donelt;/mat-icongt;  lt;/buttongt;  

тс:

 editRow(row: IWorkItem, index: number) {  if (index == undefined) {  if (  !row.ProductCategory ||  !row.Product  ) {  this._messages.Show(  "Do not leave Product Name empty",  "WARNING",  4  );  return;  }  this.WorkItems = this.dataSource.data;  this.WorkItemsChange.emit(this.WorkItems);  this.products = this._requestService.accountProductList;  } else {  let name = row.Product.ProductName;  let stockIntegrationCode = row.Product.StockIntegrationCode;   if (row.Product.ProductName) {  row.Product = this.products.filter((x) =gt; x.ProductName == row.Product.ProductName amp;amp;   x.StockIntegrationCode == row.Product.StockIntegrationCode)[0];  if (row.Product == null) {  row.Product = {};  row.Product.ProductName = name;  row.Product.StockIntegrationCode = stockIntegrationCode;  }  }  }  this.EditIndex = index; }