Angular 从arraylist中选择array并在模式中显示信息

我有一个数据表，其中显示了“id”、“原因”、“错误消息”和“stackTrace”等信息。我运行一个angular for循环来显示这些信息，但我试图跟踪索引，并在单击数组中的数据时以模式显示信息。如何将索引解析为模态，以便在那里显示信息

这是我的数据表：

身份证件
名称
错误信息
堆栈跟踪
{{item.testResultId}}

{{item.testcasetTitle}



原因：{{item.reason}}

{{item.errorMessage}

{{item.stackTrace}

解决问题的方法是向视图模型中添加一个公共对象，该对象的类型和您正在迭代的集合中的对象类型相同

然后，可以将选定对象的值指定给视图模型中的对象，如：

<tr class="rows" *ngFor="let item of ListOfTestResults; let i = index;" (click)="SelectedItem = item" data-toggle="modal" data-target="#exampleModal" [ngClass]="{'table-success': item.match, 'table-danger': !item.match}">

然后，您可以在模式中访问SelectedItem的属性：

    <!-- Modal -->
  <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">
            {{SelectedItem.testCaseTitle}}
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>

情态标题
&时代；
{{SelectedItem.testcasetTitle}
接近
保存更改

---

编辑：同时将循环移动到tr元素：）

解决问题的方法是向视图模型中添加一个公共对象，该对象的类型与您正在迭代的to集合中的对象类型相同

然后，可以将选定对象的值指定给视图模型中的对象，如：

<tr class="rows" *ngFor="let item of ListOfTestResults; let i = index;" (click)="SelectedItem = item" data-toggle="modal" data-target="#exampleModal" [ngClass]="{'table-success': item.match, 'table-danger': !item.match}">

然后，您可以在模式中访问SelectedItem的属性：

    <!-- Modal -->
  <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">
            {{SelectedItem.testCaseTitle}}
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>

情态标题
&时代；
{{SelectedItem.testcasetTitle}
接近
保存更改

---

编辑：同时将循环移动到tr元素：）

您应该在上面迭代。不，是的，谢谢。我只是试着运行它进行一个测试，在测试中我将模态it self放入循环中，但是我只能显示索引0的值，而不能显示其余的索引。但我把它改回了你应该重复的不是的，你是对的，谢谢。我只是试着运行它进行一个测试，在测试中我将模态it self放入循环中，但是我只能显示索引0的值，而不能显示其余的索引。但我把它改回了