时间戳

首页 > 解决方案 > 如何使用角度获取列数据作为工具提示

jquery - 如何使用角度获取列数据作为工具提示

问题描述

有表格，如果我在列上使用鼠标移动需要将列数据作为工具提示，请尝试以下代码并获取工具提示。但是，如果我们将鼠标悬停在下拉列表中，所有选项都会出现在工具提示中。您能否帮助我如何在工具提示中仅获取选定的选项。

  ngOnInit(): void {
    $(document).on("mousemove", "tr td", function () {
      var colVal = $(this).text();
      $(this).prop("title", colVal);
    }); 
  }

演示

标签： jqueryangulartypescript

解决方案

而不是使用jquery（angular中不推荐jquery），直接绑定title在html本身

<tr *ngFor="let person of persons;let i = index;">
   <td>
      <input [(ngModel)]="person.check" [checked]="isChecked" type="checkbox" class="checkboxCls" name="id" >
   </td>
   <td title="{{person.id}}">{{ person.id }}</td>
   <!-- Bind selected option here -->
   <td title="{{person.test}}">
      <select [disabled]="!person.check?true:null" [(ngModel)]="person.test" title="{{person.test}}" (change)="selected(person.test)">
      <option *ngFor="let prod of ProductHeader" [value]="prod.name" >{{prod.name}}</option>
      </select>
   </td>
   <td title="{{person.test}}">{{ person.test }}</td>
   <td title="person.firstName">{{ person.firstName }}</td>
   <td title="{{person.lastName}}">{{ person.lastName }}</td>
</tr>

推荐阅读