pointer-events:none在CSS中指定会禁用鼠标输入,但不会禁用键盘输入。例如,用户仍然可以选择链接并通过
Enter按键或(在Windows中)
≣Menu键“单击”它。您可以通过拦截
keydown事件来禁用特定的击键操作,但这可能会使依赖辅助技术的用户感到困惑。
禁用链接的最佳方法可能是删除其
href属性,使其成为非链接。您可以使用条件
href属性绑定来动态地执行此操作:
<a *ngFor="let link of links" [attr.href]="isDisabled(link) ? null : '#'" [class.disabled]="isDisabled(link)" (click)="!isDisabled(link) && onClick(link)"> {{ link.name }}</a>或者,按照GünterZöchbauer的回答,您可以创建两个链接,一个链接为正常链接,一个链接为禁用链接,并用于
*ngIf显示一个或另一个链接:
<ng-template ngFor #link [ngForOf]="links"> <a *ngIf="!isDisabled(link)" href="#" (click)="onClick(link)">{{ link.name }}</a> <a *ngIf="isDisabled(link)" >{{ link.name }}</a></ng-template>这是一些使链接看起来被禁用的CSS:
a.disabled { color: gray; cursor: not-allowed; text-decoration: underline;}


