Сопоставьте ключ и значение с массивом строк

В моем угловом приложении я использую таблицу, где мне нужно сопоставить значение строки (массив строк) с парой ключ-значение. Пожалуйста, помогите мне в этом.

HTML

<table  mat-table [dataSource]="dataSource">
    <ng-container matColumnDef="data">
        <th mat-header-cell *matHeaderCellDef class="bottom-primary-color"> Data </th>
        <td mat-cell *matCellDef="let row" width="150px" > {{displayData[row.data]}} </td>
    </ng-container>
</table>

TS

get displayData(): Record<string, string> {
    return {
        test1: 'testtest1',
        test2: 'testtest2',
        test3: 'testtest3',
    };
}

Я хочу добиться этого.

data = [test1, test2, test3];

Я хочу сопоставить массив data с объектом displayData и отобразить testtest1, testtest2, testtest3 вместо test1,test2,test3 для моего пользователя.

Я могу сопоставить пару ключ-значение только для первого элемента массива. Как я могу сопоставить пары ключ-значение для всех элементов массива?


person rja    schedule 25.01.2021    source источник


Ответы (1)


Как я упоминал в другом сообщении, вы можете использовать оператор ngFor для перебора ключей вашего объекта следующим образом:

<tr *ngFor="let key of Object.keys(your_json_object)">
    <td>{{your_json_object[key]}}</td>
    ...
</tr>

При таком подходе вы можете использовать displayData() для заполнения вашего источника данных, а затем получить список ключей. Здесь вы можете получить доступ к своим данным с помощью your_json_object[key], который вернет вам значение с именем ключа.

РЕДАКТИРОВАТЬ: Просто прочитайте свой пост еще раз и заметили, что вы хотите использовать массив данных для определения порядка значений. Поскольку вам удалось сделать это для первого значения, только то, что отсутствует, также должно быть ngFor. Попробуйте добавить это в свой контейнер, чтобы решить эту проблему.

person SHell    schedule 25.01.2021