3

我在我的项目中使用了 ng2-smart-table组件，但我发现了一个阻碍我的问题。

我有一个包含 3 列的智能表（模式=内联）：id、column1 和 column2。Id 不可编辑，因为在我调用后端并生成行之前，我不会知道该值，因此当我添加新行时，ID 的单元格保持为空。

我正在听发射器“onCreateConfirm”，当它被触发时，我用一个发布请求调用我的后端并等待响应。

当我处理响应时，我一直无法找到更新行中该单元格的方法。

有人遇到过同样的问题吗？这种流程是可能的还是组件的限制？

也许我做错了什么，我根本不应该遵循这个流程，还有另一种方法可以做到。

任何帮助将不胜感激。

4

1 回答 1

13

最后，在花了很多时间之后得到了这个......希望这有帮助！

在这里，当您最初单击Add New时，您将获得将禁用 id 的空单元格，并将值插入column1、column2。单击创建按钮时，您的帖子调用发生在onPostCall方法中并等待响应然后更新单元格值并最终根据您的要求显示值， 当您单击编辑按钮时也会发生同样的情况

yourapp.component.html

<ng2-smart-table [settings]="settings"  [source]="data"
(createConfirm)="onPostCall($event)" 
(editConfirm)="onPostCall($event)">
</ng2-smart-table>

yourapp.component.ts

 async onPostCall(event){
       this.value= await this.yourService.
                        getId(yourarg).first().toPromise();

                  event.newData.id =this.value
                   //  console.log(this.value);

                  event.confirm.resolve(event.newData);
                 }

 //in your settings
 settings = {
     add: {
           confirmCreate: true,
          },
    edit: {
           confirmSave: true,
          },
// 
  columns: {
            // other columns
            id: {
                editable: false,
                addable: false,
               }
           },
}

你的.service.ts

 getId(value:any){
  // your options here e.g,let options = new RequestOptions({  method: RequestMethod.Post });
  // your content here e.g, let body = JSON.stringify(value);
  return this.http.post('your_url',
          body,
          options
          ).map(res => {return res.json().yourvalue});
}

不要忘记在 app.module.ts 的提供者中添加条目 YourService ！

于 2017-10-20T15:07:26.880 回答