访问Angular 2中的DOM属性

<div #myElement>这是一个DOM元素</div>

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

@Component({
  selector: 'app-my-component',
  template: `...`
})
export class MyComponent {
  @ViewChild('myElement') myElement: ElementRef;

  ngAfterViewInit() {
    console.log(this.myElement.nativeElement.textContent);
    console.log(this.myElement.nativeElement.getAttribute('class'));
    // 访问其他DOM属性
  }
}

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

@Component({
  selector: 'app-my-component',
  template: `...`
})
export class MyComponent {
  constructor(private renderer: Renderer2, private elementRef: ElementRef) {}

  ngAfterViewInit() {
    const element = this.elementRef.nativeElement;
    console.log(this.renderer.getProperty(element, 'textContent'));
    console.log(this.renderer.getAttribute(element, 'class'));
    // 访问其他DOM属性
  }
}

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

@Component({
  selector: 'app-my-component',
  template: `...`
})
export class MyComponent {
  @HostListener('click', ['$event.target'])
  onClick(element: HTMLElement) {
    console.log(element.textContent);
    console.log(element.getAttribute('class'));
    // 访问其他DOM属性
  }
}