如何将光标指针属性应用于（单击）事件处理程序？

Question

<i class="cursor-pointer" (click)="sort()"></i>

我们的代码库有很多这样的冗余类。我一直在寻找一种在有（单击）事件处理程序时应用光标指针属性的方法。

在 angular 2 之前，您可以将 css 应用于 angular 属性，但这不再可能。更改 ngclick 上的鼠标指针

[ng-click]{
    cursor: pointer;
}

Answer 1

您可以创建一个指令，通过单击绑定选择所有元素并应用样式。

click.cursor.directive.ts：

@Directive({
  selector: '[click]'
})
export class ClickCursorDirective {
  @HostBinding('style.cursor') cursor: string = 'pointer';
}

app.component.html：

<div (click)="onClick()">Button</div>

这是一个Stackblitz 演示