首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >ui-grid columnDefs :如何将单元格内容转换为用户友好的值和数据的函数?

ui-grid columnDefs :如何将单元格内容转换为用户友好的值和数据的函数?
EN

Stack Overflow用户
提问于 2020-03-10 04:19:57
回答 1查看 53关注 0票数 0

我有这个==>

代码语言:javascript
运行
复制
$scope.uiGrid306 = {
    rowTemplate:rowtpl,
    columnDefs: [{
        field: '_ab_area', name: 'Area', width: "7%"
        , filter: { type: uiGridConstants.filter.SELECT, selectOptions: AREAS } 
        }, { ...

        }, {
        field: '_ab_x_style', name: 'Groups', width: "5%"
        , filter: { type: uiGridConstants.filter.SELECT, selectOptions: RISKS, condition: uiGridConstants.filter.EXACT
        } 
    } 
    ]//columnDefs
    , enableFiltering: true
};//-->gridOptions

但是我的_ab_x_style的数据并不像我希望的那样用户友好。因此,我需要一个函数来将这些数据的翻译返回给用户友好的单词。问题是怎么做?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-03-10 04:19:57

为此,您需要对单元格内容应用cellFilter。还有一个翻译功能,用于下拉选项,其中也包含这些非用户友好的数据。

cellFilter是应用于每个单元格内容的筛选器。

代码语言:javascript
运行
复制
$scope.uiGrid306 = {
    rowTemplate:rowtpl,
    columnDefs: [{
        field: '_ab_area', name: 'Area', width: "7%"
        , filter: { type: uiGridConstants.filter.SELECT, selectOptions: AREAS } 
        }, { ...

        }, {
        field: '_ab_x_style', name: 'Groups', width: "5%", cellFilter: 'TranslateMe'
        , filter: { type: uiGridConstants.filter.SELECT, selectOptions: RISKS, condition: uiGridConstants.filter.EXACT
        } 
    } 
    ]//columnDefs
    , enableFiltering: true
};//-->gridOptions

在角度控制器之后,您可以通过以下方式实现该过滤器

代码语言:javascript
运行
复制
Yours.controller('BodyController', function($scope, $http, $filter, uiGridConstants, $timeout, $resource) {

})
.filter( 'TranslateMe', function (){
    return(function(value){
        return((value=='dataExcep'?'red':(value=='dataExcepLblueNoVal'?'blue':(value=='dataExcepYellowRevHi'?'yellow':(value=='dataExcepNew'?'aqua':'neutral')))));
    });
});

然后,对于您的下拉选项,还必须应用函数

代码语言:javascript
运行
复制
function TranslateMe(value){
    return((value=='dataExcep'?'red':(value=='dataExcepLblueNoVal'?'blue':(value=='dataExcepYellowRevHi'?'yellow':'neutral'))));
}

为您的选项构建这样的

代码语言:javascript
运行
复制
function loadOptions( $scope, serverdata ){

    _.forEach( _.sortBy( _.uniq( _.pluck( serverdata, '_ab_x_style' ))  ), function ( eachOpt )    {
        RISKS.push( { value: eachOpt, label: TranslateMe(eachOpt) } )
    } );
    $scope.uiGrid306.columnDefs[10].filter.selectOptions = RISKS;
}

结果(而不是用户不友好的数据,我有颜色的名称) --

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/60607798

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档