javascript - 为什么 angular-ui-grid 中的 gridApi.on.edit.beginCellEdit 无法立即更新新的下拉选项？

Question

我也有同样的问题 Why ui grid value drop-down box will be assigned in the event fires before beginCellEdit in angular并且有一点点差别。在我更新 editDropdownOptionArray 后，它仍然保留旧值，只有在下次单击时才会有新值。

希望大家能帮我解决这个问题。谢谢。

这是我的代码片段:

下拉菜单的 html:

<div>
    <form name="inputForm">
        <select ng-class="'colt' + col.uid"
                ui-grid-edit-dropdown
                ng-model="MODEL_COL_FIELD"
                ng-options="field CUSTOM_FILTERS for field in editDropdownOptionsArray"></select>
    </form>
</div>

Controller 代码:

$scope.menuColumns = [
                        { displayName: 'Menu', field: 'name', enableCellEdit: false },
                        {
                            displayName: 'Access Level', field: 'accessLevelName',
                            editableCellTemplate: 'Scripts/application/role/directive/dropdown-menu-assignment.html',
                            editDropdownValueLabel: 'Access Level', editDropdownOptionsArray: userMgtConstant.menuAccessLevel
                        }
                    ];

                    $scope.menuOptions = {
                        data: [],
                        onRegisterApi: function (gridApi) {
                            gridApi.edit.on.beginCellEdit($scope, function (rowEntity, colDef, event) {
                                if (rowEntity.parent === true) {
                                    colDef.editDropdownOptionsArray = $scope.levelList;
                                } else {
                                    colDef.editDropdownOptionsArray = $scope.childLevelList;
                                }
                            });
                            gridApi.edit.on.afterCellEdit($scope, function (rowEntity, colDef, newValue, oldValue) {
                                if (rowEntity.parent !== true) {
                                    if(rowEntity.name === 'Revenue Bench'){
                                        var accessLevel = commonUtils.getIdFromName(rowEntity.accessLevelName, userMgtConstant.menuAccessLevel);
                                        if(accessLevel > 1){
                                            $scope.isShowFunctionAssignment = false;
                                        } else if(rowEntity.functionAssignments.length !== 0) {
                                            $scope.isShowFunctionAssignment = true;
                                        }
                                    }
                                } else {
                                    // udpate child dropdown list menu
                                    var index = _(userMgtConstant.menuAccessLevel).indexOf(newValue);
                                    $scope.childLevelList = $scope.levelList.filter(function (item, i) {
                                        return i >= index;
                                    });

                                    if($scope.childLevelList.length > 2){
                                        parentSwitch = true;
                                    }

                                    if($scope.childLevelList.length < 3 && parentSwitch){
                                        colDef.editDropdownOptionsArray = $scope.childLevelList;
                                        parentSwitch = false;
                                    }

                                    // update all child value
                                    _($scope.menuOptions.data).each(function (dataItem) {
                                        if (dataItem.parent !== true) { // prevent infinite loop
                                            dataItem.accessLevelName = newValue;
                                        }
                                    });
                                }
                            });
                        }
                    };

这是网格的用法:

<inline-edit-grid options="menuOptions" columns="menuColumns"></inline-edit-grid>

Answer 1

您应该研究 editDropdownRowEntityOptionsArrayPath 的用法，而不是 editDropdownOptionsArray

来自文档:

editDropdownRowEntityOptionsArrayPath can be used as an alternative to editDropdownOptionsArray when the contents of the dropdown depend on the entity backing the row.

这里是 tutorial 的链接