如何检测angular 6中动态添加元素上的点击事件

在Angular 6中，可以通过以下步骤来检测动态添加元素上的点击事件：

1. 首先，在组件的模板文件中，使用*ngFor或其他方式动态生成元素。例如，假设我们要动态添加按钮：

<div>
  <button *ngFor="let item of items" (click)="handleClick(item)">{{ item }}</button>
</div>

1. 在组件的类文件中，定义items数组和handleClick方法。items数组用于存储要动态添加的元素，handleClick方法用于处理点击事件：

import { Component } from '@angular/core';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  items: string[] = [];

  handleClick(item: string) {
    console.log('Clicked:', item);
  }
}

1. 现在，当你向items数组中添加元素时，相应的按钮会动态生成，并且点击按钮时会触发handleClick方法。例如，可以在组件的构造函数中添加一些初始元素：

constructor() {
  this.items.push('Item 1', 'Item 2', 'Item 3');
}

这样，当页面加载时，会显示三个按钮，并且点击按钮时会在控制台中打印相应的消息。

请注意，以上示例仅演示了如何在Angular 6中检测动态添加元素上的点击事件。对于更复杂的场景，可能需要根据具体需求进行适当的调整和扩展。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云官网：https://cloud.tencent.com/
• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
• 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iothub
• 移动推送服务（信鸽）：https://cloud.tencent.com/product/tpns
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 区块链服务（BCS）：https://cloud.tencent.com/product/bcs
• 腾讯云元宇宙：https://cloud.tencent.com/solution/virtual-universe