Таблица угловых данных

export class User {
    fname: string;
    lname: string;
    email: string;
    mobile: string;
    password: string;
    roles: Array<{
    name: string
  }>;
}

объект json

{
        "email": "[email protected]",
        "mobile": "9895276034",
        "fname": "test",
        "lname": "User",
        "password": "secret",
        "roles": [
            {
                "name": "accounts"
            },
            {
                "name": "ADMIN"
            }

Мой HTML

<ng-container matColumnDef = "roles">
  <th mat-header-cell *matHeaderCellDef mat-sort-header>Roles</th>

  <td mat-cell *matCellDef = "let data ">{‌{data.roles[0].name}}</td>

</ng-container>

Здесь есть две роли. Первая роль (т.е. учетные записи, которые я получаю, как указано выше). Как мне перейти здесь ко второй роли (например, «АДМИНИСТРАТОР» с помощью цикла).

Пожалуйста, помогите

используйте директиву ngFor

Chellappan வ 16.09.2018 07:47

но как и где @Chellappan

Sagar 17.09.2018 14:00
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
2
114
1

Ответы 1

Я полагаю, вы хотите, чтобы roles.name располагались здесь в разных рядах? Директива ngFor используется для перебора списка в angular. Ниже приведен фрагмент с использованием ngFor.

<ng-container matColumnDef = "roles">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>Roles</th>
    <tr *ngFor = "let role of data.roles">
        <td mat-cell *matCellDef = "let data ">{‌{role.name}}</td>
    </tr>
</ng-container>

UserTableComponent.html: 35 ОШИБКА TypeError: Невозможно прочитать "роли" свойства undefined в Object.eval [как updateDirectives] (UserTableComponent.html: 37) в Object.debugUpdateDirectives [как updateDirectives] (core.js: 11061) в checkAnd coreUpdateView (core.js: 11061) .js: 10458) в callViewAction (core.js: 10699) в execComponentViewsAction (core.js: 10641) в checkAndUpdateView (core.js: 10464) в callViewAction (core.js: 10699) в execEmbeddedViewsAction (core.js: 10662) в checkAndUpdateView (core.js: 10459) в callViewAction (core.js: 10699)

Sagar 17.09.2018 14:03

Как называется ваш объект Json? Вы не упомянули то же самое. Я предположил, что это данные.

Jahnavi Paliwal 17.09.2018 14:39

Другие вопросы по теме