ngFor - невозможно отсортировать массив объектов Angular 5
У меня есть массив массивов объектов в Angular, и я пытаюсь отсортировать в HTML.
Вывод массива показан в консоли Chrome:
С образцом внутри массива:
в машинописном файле:
this.results = [
[{score: 0.535632, tone_id: "anger", tone_name: "Colère"}],
[{score: 0.633569, tone_id: "anger", tone_name: "Colère"},
{score: 0.506763, tone_id: "analytical", tone_name: "Analytique"}],
[{score: 0.895438, tone_id: "joy", tone_name: "Joie"}],
[{score: 0.736445, tone_id: "joy", tone_name: "Joie"},
{score: 0.955445, tone_id: "analytical", tone_name: "Analytique"}],
[{score: 0.796404, tone_id: "anger", tone_name: "Colère"}],
[{score: 0.52567, tone_id: "sadness", tone_name: "Tristesse"},
{score: 0.639934, tone_id: "anger", tone_name: "Colère"}],
[{score: 0.557769, tone_id: "fear", tone_name: "Peur"}],
[{score: 0.51583, tone_id: "joy", tone_name: "Joie"},
{score: 0.874372, tone_id: "confident", tone_name: "Confiant"}]
];
В файле HTML я зацикливаю массив, инициализированный как results
с помощью *ngFor
но не могу отобразить объекты внутри массива:
<tbody *ngIf="results.length">
<ng-container *ngFor="let res of results;let i = index">
<tr>
<td>{{ i + 1 }}</td>
<td colspan="2">
<table>
<tr>
<td>Score: {{res.score}}</td>
<td>Emotion: {{res.tone_name}}</td>
</tr>
</table>
</td>
</tr>
</ng-container>
<tbody>
Он показывает пустой результат в таблице в браузере.
1 ответ
С *ngFor="let res of results"
, res
будет то, что на каждом индексе в results
, В каждом случае это будет другой массив, поэтому вам понадобится другой *ngFor
просмотреть его содержимое.
<tbody *ngIf="results.length">
<ng-container *ngFor="let res of results;let i = index">
<tr>
<td>{{ i + 1 }}</td>
<td colspan="2">
<table>
<tr *ngFor="let obj of res">
<td>Score: {{obj.score}}</td>
<td>Emotion: {{obj.tone_name}}</td>
</tr>
</table>
</td>
</tr>
</ng-container>
<tbody>