Как динамически воссоздать столбцы таблицы данных во время выполнения? - PullRequest
0 голосов
/ 28 марта 2019

Я вызываю службу API, которая возвращает массив JSON.У меня также есть код во внешнем интерфейсе, который составляет список столбцов или полей на основе JSON.Этот список столбцов не является фиксированным списком и может отличаться в зависимости от содержимого JSON.Итак, мне нужно динамически воссоздавать столбцы сетки данных во время выполнения.

Это работает при использовании директивы * ngFor и циклически перебирает массив столбцов, который предварительно определен или предварительно инициализирован в коде, но мне нужноизменить список столбцов во время выполнения.

Пример:

<clr-dg-column *ngFor="let field of fields" [clrDgField]="field.name">
    {{ field.text }}
</clr-dg-column>
let fields = [ { name: "id", text: "Id" }, { name: "name", text: "Name" }];

changeFields() {
    this.fields = [ { name: "userId", text: "User Id" }, { name: "desc", text: "Description" }];
}

Когда вызывается функция changeFields(), я ожидал, что столбцы таблицы данных будут изменены на новый списокколонн.Но проблема в том, что он не выполняет повторную визуализацию столбцов.

В приведенном ниже примере показано первое изображение с начальными столбцами таблицы данных, на 2-м изображении показаны пустые столбцы при изменении во время выполнения.

Перед изменением переменных полей:

Before changing columns

После изменения полей во время выполнения:

After changing columns

...