Question

好吧，标题与其他帖子非常相似：

Angular Grid ag-grid columnDefs Dynamically change

AG-Grid: Make editable columns based on response from server

但我会问一个稍微不同的问题。

现在我有一堆存储在tableColumns变量中的列。

每列都有一个可编辑的属性。

对于现有数据，某些列是可编辑的，有些则不是。这是通过以下功能实现的。我在定义columnDefs时调用它。

def panelThree(request):

        startDate = ''
        endDate = ''
        byOtherField = ''

        if request.method == 'POST':
            form = QueryForm(request.POST)

            startDate = request.POST.get('startDate')
            endDate = request.POST.get('endDate')
            byOtherField = request.POST.get('byOtherField')

        else:
            form = QueryForm()

        # if not byOtherField:
        dataTable = Production.objects.order_by('-id')
        return render(request, 'frontend/panelThree.html', {
            'form': form, 'dataTable': dataTable,  'startDate':startDate
        })

但是，对于添加在网格底部的新插入行，我希望所有列只能为此记录编辑。

此记录可以通过列isChanged =＆＃34;插入＆＃34;来识别。

checkEditable(columnName: string){
        var editable = false;
        this.configData.some((el) => {
          if (columnName == el.key.columnName){
            return el.editable == "Y";
          }
        });
        return editable;
      }

我很可能需要创建一个功能来实现这一点，但似乎我无法将功能分配给可编辑的＆＃39;专栏的属性？什么是正确的语法？

Answer 1

这不是你的语法，而是方法。

以下方法适合您。

为所有列制作可编辑的true。
对于要插入的新行，请使用一个标志来指定新插入的记录。您已将其作为newData["isChanged"] = "inserted"
使用(cellEditingStarted)="onCellEditingStarted($event)"事件检查当前编辑记录是否为newly inserted记录。
- 如果是，则将其设为可编辑
- 如果不是，则检查当前列是否可编辑。

检查此代码

 onCellEditingStarted($event) {
    if($event.data.isChanged != 'inserted' && $event.colDef.editable != true)
    // check property is used at column level to identify editable or not in above statement
        this.gridApi.stopEditing();
}

供参考（不完全符合您的要求，但您会明白）：how to disable editing for only some rows in ag grid

Angular Grid Ag-Grid，使列可动态编辑

1 个答案: