Как разделить код и данные в настройках столбца для таблицы угловых материалов

#angular #angular-material #material-table

#угловой #угловой материал #материал-таблица

Вопрос:

 columns = [  {  columnDef: 'position',  header: 'No.',  cell: (element: PeriodicElement) =gt; `${element.position}`,  numberFilter: true,  footer: true,  footerValue: 'Total',  },  {  columnDef: 'name',  header: 'Name',  cell: (element: PeriodicElement) =gt; `${element.name}`, //cell settings  stringFilter: true, //filter for strings  filterList: ELEMENT_DATA.map((x) =gt; x.name), //filter values  footer: false,  } ]  

Заданы настройки столбцов для таблиц угловых материалов. Я хочу создать универсальный компонент и импортировать столбцы в виде массива данных из другого файла или даже базы данных. Тем не менее, у меня есть некоторые вызовы функций и кода. Есть идеи, как это решить, т. Е. импортировать данные в компонент с таблицей и использовать функции локально?

Комментарии:

1. Не могли бы вы, пожалуйста, объяснить это подробнее ? Спасибо.

2. @GRD Я хочу передавать обычные переменные, а не что-то вроде ELEMENT_DATA.map((x) =gt; x.name), или (элемент: PeriodicElement) =gt;gt; gt;gt; ${element.position} ,. Затем я могу передать настройки столбцов в виде массива объектов и сохранить свои данные за пределами самого компонента

3. Можете сделать какую-нибудь демонстрацию с помощью stackblitz ?