Значения столбцов ColumnsDirective не отображаются, когда столбцы добавляются динамически - PullRequest
Новая
       46

Значения столбцов ColumnsDirective не отображаются, когда столбцы добавляются динамически

0 голосов
/ 08 мая 2020

Мне нужно отображать ColumnsDirective динамически на основе выбора пользователя среди множества полей, которые могут быть не только стандартными, которые использует GanttComponent , как показано в документации по началу работы: 

this.taskFields = {
        id: 'TaskID',
        name: 'TaskName',
        startDate: 'StartDate',
        duration: 'Duration',
        progress: 'Progress',
        child: 'subtasks',
    };

Когда эти другие поля включены в ColumnsDirective на начальном экране GanttComponent , значения в ячейках столбцов будут отображаться как enter image description here

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

Вот stackblitz , показывающий проблему ( скриншот )

Я пробовал предварительно определить эти столбцы в taskFields, даже до того, как их динамические c добавить в ColumnsDirective , но это не решило проблему.

1 Ответ

0 голосов
/ 12 мая 2020

Вместо того, чтобы обновлять всю диаграмму Ганта, мы рекомендуем вам динамически изменять видимость столбца с помощью методов showColumn и hideColumn publi c. 

<button type="button" onClick={ev => { 
   if (this.ganttInstance.getGridColumns()[2].visible) { 
     this.ganttInstance.hideColumn('fieldXX1'); 
   } 
   else { 
      this.ganttInstance.showColumn('fieldXX1'); 
   } 
}}>Change Comlumns</button>

Пример - https://stackblitz.com/edit/react-6lscfc-yqzk6h?file=index.js

Мы также предоставили решение для обновления всего ганта с помощью метода refre sh. 

<button type="button" onClick={ev => { 
       //... 
  setTimeout(function () { 
    var obj = document.getElementById('Default').ej2_instances[0]; 
      obj.refresh(); 
  }, 100); 
}}>Change Columns</button>

Пример - https://stackblitz.com/edit/react-6lscfc-n3xgjh?file=index.js

...