Question

我有一个带有下拉菜单的表格，其中包含一些值。用户应该能够为任何行选择下拉列表，并且当他们更改值并单击Submit时，应该在本地更改该行上的数据，然后将其发布到数据库中。

我不知道如何获取所选行的特定ID，也不知道如何在本地更新事件。

我所做的事情： -创建表并显示数据库中的所有行 -为下拉菜单创建了“ ng-template” -创建了将事件发布到API的服务（已经设置了API端点） -在我的组件.TS文件中创建了一个函数，以从下拉菜单中读取所选值。

这是我的表格代码：

<ngx-datatable #table class='material' 
              [columns]="columns" 
              [columnMode]="'force'" 
              [headerHeight]="50" 
              [footerHeight]="20"
              [rowHeight]="200" 
              [limit]="50" 
              [rows]='rows'              
              [scrollbarH]="true">
 </ngx-datatable>

这是我的ng-template代码：

请给我活性选项2 选项3 保存

这是我的组件Typescript File方法（我知道这可能是错误的，我只是在尝试使其工作）

UpdateMonitoredEvent(event: MonitoredEvents, Id) {
  //Get selected value from dropdown on row
  console.log(this.value);
  this.monitoredEventService.getEventId().subscribe ( res => {
    console.log(res);
  })
  //Get ID of the event being updated

  //add ID to that event
  //Post event
  this.monitoredEventService.soldOut(this.value, event).subscribe(res => {
    console.log(res);

    this.toastr.success('Sucessfully updated event status');
  })
}

最后是服务代码

soldOut(Id: number, event: MonitoredEvents){
        return this.httpClient.post<any>(this.config.getBaseUrl() + "/api/events/" + event, Id)
     }

我的预期结果是将更改后的值发布到数据库中的事件。该API希望整个事件都可以发布。

如何更新表格行中的值并将更改发布到API？

0 个答案: