Использовать {{COL_FIELD}} в UI-Grid cellTemplate - PullRequest
Новая
       32

Использовать {{COL_FIELD}} в UI-Grid cellTemplate

2 голосов
/ 05 июня 2019

Я сталкиваюсь с некоторыми трудностями при попытке использовать значение COL_FIELD в шаблоне ячейки пользовательского интерфейса.

По сути, я пытаюсь установить цвет для каждой ячейки на основе ее значения вСловарь 'dateColor'.

Код выглядит так: 

function getMyServersTableFields(fieldsToShow,dateColor) {

            var specificColumnDef = [];

            _.each(fieldsToShow, function (item) {

                    specificColumnDef.push(
                        {
                            name: 'item',
                            displayName:'item',
                            cellClass: 'ui-grid-cell-contents',
                            cellTooltip: true,
                            cellTemplate: '<div><strong style="color: ' + dateColor[ {{COL_FIELD}} ] + '"">{{COL_FIELD}}</strong></div>',
                            minWidth: 150,
                            aggregationType: function (items) {
                                return 'Total servers: ' + $filter('number')(items.length);
                            }
                        }
                    );
            }   

    }

Как вы можете видеть, dateColor - это словарь, и я пытаюсь установить цвет, получаязначение {{COL_FIELD}} в этом словаре, но я не могу заставить его работать.Какие-либо предложения?

1 Ответ

1 голос
/ 21 июня 2019

Ваше определение cellTemplate неверно. COL_FIELD должен находиться внутри определения строки, COL_FIELD вне строки не существует.

Вы можете сделать это так: 

function getMyServersTableFields(fieldsToShow, dateColor) {
var specificColumnDef = [];
_.each(fieldsToShow, function (item) {
    specificColumnDef.push({
        name: 'item',
        displayName: 'item',
        cellClass: 'ui-grid-cell-contents',
        cellTooltip: true,
        //cellTemplate: '<div><strong style="color: ' + dateColor[ {{COL_FIELD}} ] + '"">{{COL_FIELD}}</strong></div>',
        cellTemplate: '<div><strong ng-style="{\'color\': col.colDef.dateColor[COL_FIELD]}">{{COL_FIELD}}</strong></div>',
        dateColor: dateColor,
        minWidth: 150,
        aggregationType: function (items) {
            return 'Total servers: ' + $filter('number')(items.length);
        }
        })
    })
}

Я также изменил стиль на стиль ng, так как вы используете интерполяцию для установки стиля.

...