Вызов ячейки CSV в формате HTML

#html #angular #typescript #csv

Вопрос:

Я пытаюсь вызвать определенное значение ячейки в HTML из импортированного CSV-файла. Файл, который я импортирую, имеет значение «100» под заголовком «Максимальная оценка».

То, что я пытался сделать, включает в себя:
<span>{{csvRecords[1]["Maximum Grade"]}}</span>

Я делаю это, чтобы попытаться назвать значение «100». Я вызываю первый, потому что значение будет одинаковым по всей таблице, но не по файлам. Но это вообще ничего не показывает.

Вот таблица, с которой я работаю:

     <table id="master-table">
        <thead>
            <tr>
                <th>#</th>
                <th>Name</th>
                <th>Email</th>
                <th>Timestamp</th>
                <th>Grade</th>
                <th>Feedback</th>    
            </tr>
        </thead>
        <tbody>
            <tr *ngFor="let csvData of csvRecords; let i = index;" (click)="goToStudent(i)">
                <td>{{i 1}}</td>
                <td>
                    <span>{{csvData["Full name"]}}</span>
                </td>
                <td>
                    <span>{{csvData["Email address"]}}</span>
                </td>
                <td>
                    <span>{{csvData["Last modified (submission)"]}}</span>
                </td>
                <td>
                    <span>{{csvData["Grade"]}}</span>
                </td>
                <td>
                    <span>{{csvData["Feedback comments"]}}</span>
                </td>
            </tr>
        </tbody>        
    </table>
 

Что делает мое приложение, так это импортирует CSV-файл и анализирует его в таблице в DOM. Проблема в том, что я изо всех сил пытаюсь вызвать определенное значение в анализируемой таблице.

Вот фрагмент CSV-файла: https://i.stack.imgur.com/yPrIj.png

CSV-анализатор находится в пользовательском компоненте, хотя я не уверен, что это изменит решение.