生成表格单元格上的角度 - （单击）事件

我一直试图在动态生成的表格中的单元格上添加（单击）事件。生成表格单元格上的角度 - （单击）事件

HTMLtoAdd:any; 
    @Input() roles:string; 
    ngOnInit() { 
    let alphabet = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']; 
    let table = document.createElement('table'); 
    for (let i=0;i<10;i++){ 
     let newRow = document.createElement('tr'); 
     for (let j=0;j<10;j++) { 
     let newCell = document.createElement('td'); 
     let cellId = alphabet[i]+j; 
     newCell.setAttribute("id",cellId); 
     newCell.setAttribute("(click)","alert(this.id)"); 
     newRow.appendChild(newCell); 
     } 
     table.appendChild(newRow); 
    } 
    this.HTMLtoAdd = table.outerHTML; 
    };

当我这样做，我得到这个错误：

'setAttribute' on 'Element': '(click)' is not a valid attribute name.

我怎么能添加此事件，只要我需要生成表？

随意问如果需要更多的细节。

来源

2017-06-14 Josselin PEREZ

有一个在HTML非标准无'（点击）'属性。它是角度特定的属性，用于角度编译模板时，它将在DOM之后从DOM中移除 – yurzui

而不是使用香草javascript添加表格，而应该使用angular的'ngFor'来创建表格单元格。然后'（click）'绑定也会起作用。 – schrej

这是我如何解决它：

模板：

<table> 
    <tr *ngFor="let row of columns"> 
    <td *ngFor="let cell of rows" (click)="log(row+cell)"></td> 
    </tr> 
</table>

组件：

columns:string[]=[]; 
    rows:number[]=[]; 
ngOnInit() { 
    let gridSize = 10; 
    for (let i=0; i<gridSize;i++){ 
     this.columns.push(String.fromCharCode(65+i)); 
    }; 
    for (let i=0; i<gridSize;i++){ 
     this.rows.push(i); 
    } 
    };

来源

2017-06-14 11:51:28

生成表格单元格上的角度 - （单击）事件

回答

相关问题