Angular6 如何在angular7中将下拉列表插入到动态表中
试图在动态表中插入下拉列表,但我不知道如何操作。我想在最后一列插入带有一些值的下拉列表。请帮助任何人找到解决方案Angular6 如何在angular7中将下拉列表插入到动态表中,angular6,angular7,angular8,Angular6,Angular7,Angular8,试图在动态表中插入下拉列表,但我不知道如何操作。我想在最后一列插入带有一些值的下拉列表。请帮助任何人找到解决方案 head = [ "Name", "Age", "Gender","Action"]; details = [ { "name": "star1", "age": "25", "gender": "male","action": "" }, { "name": "star2", "age": "22", "gen
head = [ "Name", "Age", "Gender","Action"];
details = [
{ "name": "star1", "age": "25", "gender": "male","action": "" },
{ "name": "star2", "age": "22", "gender": "female","action": "" },
{ "name": "star3", "age": "21", "gender": "male","action": "" },
{ "name": "star4", "age": "35", "gender": "female","action": "" },
];
constructor(){
this.tableHead = this.head;
this.userDetails = this.details;
}
演示:我为您提供了一个解决方案。请将您的详细信息数组替换为
details = [
{ name: "star1", age: "25", gender: "male", action: ["Edit", "Delete"] },
{ name: "star2", age: "22", gender: "female", action: ["Edit", "Delete"] },
{ name: "star3", age: "21", gender: "male", action: ["Edit", "Delete"] },
{ name: "star4", age: "35", gender: "female", action: ["Edit", "Delete"] }
];
然后将dynamic table.component.html替换为下面的代码
<table>
<thead>
<tr class="table-head">
<th *ngFor="let tableHead of tableHeads">{{tableHead}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let tableData of tableDatas">
<td *ngFor="let colName of tableColNameGenerated"> {{colName != 'action' ? tableData[colName] : ''}}
<span *ngIf="colName == 'action'">
<select>
<option *ngFor="let opt of tableData.action">{{opt}}</option>
</select>
</span>
</td>
</tr>
</tbody>
</table>
{{tableHead}}
{{colName!=“action”?tableData[colName]:''}
{{opt}}
现在我希望你的担忧得到解决。
希望这有帮助!
多谢各位