angularJS -UI网格单元格动态列的工具提示

编程问答 2022-08-13

问题描述

我有一个返回动态列的存储过程，我能够在angularJS ui-grid上的一些帮助下绘制输出。现在，我正在尝试添加“ CellToolTip”。下面的屏幕快照是存储过程的输出，其中第25到22列是动态的（这意味着它们的范围可以从150到0，具体取决于对存储过程的输入）。以“ Tgt”开头的列是“目标”，我不想显示这些目标，但是将其悬停在该列上时会显示目标值。我能够成功地隐藏网页上的“ Tgt-”列，而没有出现问题。

现在，当我将鼠标悬停在需要帮助的动态列25到22上时，我需要将它们显示为CellToolTip。在下面的屏幕快照示例中，当我将鼠标悬停在值0.901的单元格上时，该单元格对应于第25列和“增值税填充计算F / P比率”属性名行，我希望看到“ 0.89”。但是，如果我将鼠标悬停在第25列和“增值税批数据F / P”属性名的单元格值0.89上，则我希望看到“无值”，因为Tgt-25列的attributeName为NULL。

在下面的push函数中的代码中，我添加了“ var key ='Tgt-'+ sortedKeysArray [i]; var value = row.entity [key];“。当我放置断点时，我得到一个错误，提示密钥未定义。但是如果我对密钥值进行硬编码，例如” var value = row.entity [“ Tgt-25”];“，那么我需要帮助使悬停值动态变化，我想从它们各自的目标列中获取目标值。在此先感谢您的帮助。

enter image description here

            LRWService.getVatMakeRpt('1','1221209','100000028','2020-05-08','2020-05-08').success(function (data) {
                if (data === null || data.VatMakeRptList === null || data.VatMakeRptList.length === 0) {

                    $scope.error = true;
                    $scope.errorDescription = "No data found for selected criteria.";
                } else {
                    $scope.gridOptionsVatMakeRpt.paginationPageSizes.push(
                        data.VatMakeRptList.length
                    );
                    var VatMakeRptList = data.VatMakeRptList;
                    var keysArray = [];

                    keysArray = Object.keys(VatMakeRptList[0]);
                    var sortedKeysArray = keysArray.sort().reverse();

                    $scope.gridOptionsVatMakeRpt.columnDefs.push({ name: 'LineNumber',field: 'LineNumber',width: '20%',visible: true });
                    $scope.gridOptionsVatMakeRpt.columnDefs.push({ name: 'AttributeName',field: 'AttributeName',visible: true });


                    for (var i = 0; i < sortedKeysArray.length; i++) {
                        if (!(sortedKeysArray[i] == "LineNumber" || sortedKeysArray[i] == "AttributeName" || sortedKeysArray[i].includes("Tgt-") == true ))

                            $scope.gridOptionsVatMakeRpt.columnDefs.push({
                                name: sortedKeysArray[i],field: sortedKeysArray[i],visible: true,cellTooltip: function (row,col) {
                                    var key = 'Tgt-' + sortedKeysArray[i];
                                    // var value = row.entity["Tgt-25"];
                                    var value = row.entity[key];
                                    if (value != null) {
                                        return value;
                                    } else {
                                        return "No Value";
                                    }
                                }
                            });
                    }
                }

解决方法

我要做的就是将“ Key”值移到if语句上方。

basic auth
angular-ui-gridangularjsui-grid