Angular 4（单击）不适用于<i>元素

Question

您好我有快速提问。任何人都可以向我解释为什么（点击）不能处理html元素？

通过将整个元素放在标记中并应用（单击）

，我找到了解决方法

table.component.html

<th>Date of creation <i class="fa fa-sort" (click)="sort()"></i></th>

table.component.ts

import { Component, OnInit } from '@angular/core';
import { DocumentsService } from '../documents.service';

@Component({
  selector: 'app-table',
  templateUrl: './table.component.html',
  styleUrls: ['./table.component.css']
})
export class TableComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

  sort(){
    console.log("test");
  }
}

所以我只是好奇为什么这不适用于元素？

Answer 1

嗯，<i></i>标签之间没有任何内容，因此无法点击或提升点击事件。在标签之间写一些东西，你就可以调用你的排序方法了。