在项目中,免不了要在ts代码中进行动态添加按钮;但是直接写(click),页面并不能正确渲染出按钮的点击事件。代码展示怎么动态添加点击事件:
1.使用document创建一个tr:
const tr = document.createElement('tr');
2.在tr中添加需要的td内容;注意一下代码中的(click)事件是无效的,因为点击事件不会被渲染;
3.为a添加点击事件;主要使用Renderer
import{ Renderer } from '@angular/core';
constructor( private el: ElementRef,
privaterenderer: Renderer) {}
var aUpdate = tr.querySelector('a.bg-color-blue');
this.renderer.listen(aUpdate, 'click', (event) => {
event.stopPropagation();
console.log("click update");
});
var aDelete = tr.querySelector('a.bg-color-red');
this.renderer.listen(aDelete, 'click' , (event) => {
event.stopPropagation();
console.log("click delete");
});
4.效果展示