angular6 - 如何在角度 6 中获取表的第一列 td 值
问题描述
尝试在选择下拉更改值后获取表的第一列 td 值但不起作用。我想在角度 6 中选择下拉列表后获得第一列 td 值。我在下面给出了我的代码。任何人都可以有想法?请帮助找到解决方案。
<table class="table table-striped table-hover" id="wrapperTbl">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Job</th>
<th>YearJoined</th>
<th>Missions</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let astronaut of astronautsToBeSelected" class="clickable">
<td (click)="selectAstronaut(astronaut)">{{astronaut.id}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.name}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.job}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.year_joined}}</td>
<select (change)="selected()">
<option *ngFor="let mission of astronaut.missions" [selected]="mission.name == 'back'">{{mission}} </option>
</select>
</tr>
</tbody>
解决方案
您可以执行以下操作 -
<tbody>
<tr *ngFor="let astronaut of astronautsToBeSelected" class="clickable">
<td (click)="selectAstronaut(astronaut)">{{astronaut.id}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.name}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.job}}</td>
<td (click)="selectAstronaut(astronaut)">{{astronaut.year_joined}}</td>
<td><select (change)="selected($event, astronaut.id)">
<option *ngFor="let mission of astronaut.missions" [selected]="mission.name == 'back'">{{mission}} </option>
</select>
</td>
</tr>
</tbody>
当您想要访问任何事件时,您将需要 html 中的 $event。您还可以传递所需的其他参数。
selected(event, id){
//tbal id is wrapperTbl
alert(event.target.value + '|' + id )
}
希望这可以帮助。
推荐阅读
- python-xarray - xarray 如何使用 open_rasterio 加载和索引大型 GeoTIFF 文件?
- bash - 如何使用&符号'&'命令在许多目录中多次执行此查找命令?
- python - 使用 python 抓取网站
- javascript - 如何让 setState 在功能性 React 组件的事件处理程序中工作
- javascript - 将“onclick”属性添加到 javascript 函数中的按钮
- dictionary - 对所有具有相同键的元组求和(实现 Haskell Data.Map.fromListWith)
- django - Django Import Export:如何在导入前追加行
- javascript - Javascript 的 AbortController 信号
- c++ - ld 找不到生成的函数
- python-3.x - 具有与夹具关联的参数化值的 Pythonic 解决方案。(pytest)