Точки в скобках для доступа к вложенному свойству

Question

Рассмотрим объект ниже:

var item = {
  id: 'some-id',
  price: 12,
  customer: {
     id: 'fake-id',
     name: 'fake-name'
   }
};

Мы можем получить доступ к имени клиента, используя "точки" или "скобки", как показано ниже:

• item.customer.name
• item['customer'].name
• item.customer['name']
• item.['customer']['name']

Вопрос

В Javascript или Typescript, есть ли способ получить доступ к имени клиента, как показано ниже:

item['customer.name'] или item[customer.name]

Примечания

В angular Я создал многократно используемый компонент таблицы на основе таблицы mat, которая включает нумерацию страниц, фильтр сортировки и множество других функций ... Я использую следующее для определений столбцов:

mytable.component.ts :

export interface MyTableCol {
    id: string;
    title: string;
    // some other settings...
}

mypage.component.ts:

cols: MyTableCol[] = [
  {id: 'price', title: 'Total Price'},
  {id: 'customer.name', title: 'Customer Name' }
];

mypage.component. html:

<my-table [columns]="cols"></my-table>

mytable.component. html:

<ng-container [matColumnDef]="col.id" *ngFor="let col of columns">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>
            {{ col.title}}
    </th>
    <td mat-cell *matCellDef="let element">
        {{ element[col.id] }}
    </td>
</ng-container>

Однако для вложенных свойств (customer.name) это не будет работать. Я думаю, что причина в строке: element[col.id] преобразуется в element['customer.id'] в случае столбца имени клиента.

Как я могу решить эту проблему?

Answer 1

Передача такой строки для доступа к свойствам не будет выполняться автоматически, вам нужно создать функцию получения, например loda sh _get , и использовать ее для поиска нужного значения. А потом напишите что-то вроде:

{{ _getAtr(element, col.id) }}