Как объединить два значения свойств в один столбец таблицы данных для таблицы данных Angular 7? (Пример: имя и фамилия в одном столбце)

Question

Я хочу объединить имя и фамилию человека и отобразить его как Имя в столбце в моей таблице, используя таблицу данных Angular 7.Здесь имя и фамилия - это два разных свойства.

  <data-table [items]="userItems"
                        [itemCount]="userItemCount"
                        [pageLimits]="limits"
                        [limit]="5"
                        (reload)="reloadItems($event)"
                        (rowClick)="onRowClick($event)"
                        (rowDoubleClick)="rowDoubleClick($event)"
                        [rowTooltip]="rowTooltip">
              <data-table-column [property]="'UserId'"
                                 [header]="'UserId'"
                                 [visible]="false">
              </data-table-column>
              <data-table-column [property]="'FirstName'"
                                 [header]="'Name'"
                                 [sortable]="true">
              </data-table-column>

Answer 1

Мы можем использовать ng-шаблон для достижения вышеуказанного требования.

          <data-table-column [property]="'FirstName'"
                                 [header]="'Name'"
                                 [sortable]="true">
                <ng-template #dataTableCell let-item="item">
                  {{item.FirstName}} <span *ngIf="item.MiddleName != ''"> 
                  {{item.MiddleName}} </span><span>{{item.LastName}}</span>
                </ng-template>
           </data-table-column>