Question

使用jquery，我们可以做类似

的事情

$(.some-class).click(function() { alert('Hello!!');});

使用Angular2 / Angular4，我知道我们可以拥有

(click)="alert('Hello!!');"

但这意味着，我必须为每个元素做到这一点。

有没有办法为具有相同类的所有元素分配相同的方法？

编辑：我不想按类选择元素，对于具有相同类的所有元素，具有与click事件绑定的相同功能。

Answer 1

你可以像下面这样做，

import { Component, Directive, ElementRef, HostListener } from '@angular/core';

@Directive({
  selector: '.some-class'
})
export class SomeClassDirective {
  constructor(private el: ElementRef) { }
  @HostListener('click') onClick() {
    console.log('Hello');
  }
}

@Component({
  selector: 'my-app',
  template: `<h1>Hello {{name}}</h1>
  <div class='some-class' >added some-class css class attribute</div>
  `
})
export class AppComponent { 
  name = 'Angular'; 
}

选中此Plunker

希望这会有所帮助!!

将函数绑定到类中所有元素的事件的角度方式

1 个答案: