ui-grid columnDefs: как перевести содержимое ячейки в какое-то значение, которое является удобным для пользователя и функцией данных?

Question

У меня есть это ==>

$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 содержит данные, которые не являются удобными для пользователя, как я хотел, чтобы они были. Поэтому мне нужна функция для возврата перевода этих данных в удобные для пользователя слова. Проблема в том, КАК ???

Answer 1

Для этого вам необходимо применить cellFilter к содержимому ячейки. И функция перевода для выпадающих опций, которая также содержит данные, не предназначенные для пользователя.

cellFilter - это фильтр, который применяется к содержимому каждой ячейки.

$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

Сразу после контроллера angular этот фильтр реализуется с помощью

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')))));
    });
});

Затем для выпадающих опций вы также должны применить функцию

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

для создания опций как таковых

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;
}

Результат (вместо данных, недружественных для пользователя, у меня есть названия цветов) -