nz-tag disabled not working

[snebjorn]

Reproduction link

https://stackblitz.com/edit/angular-ry15ho?embed=1&file=src/app/app.component.ts

Steps to reproduce

Add disabled or [disabled]="true" to <nz-tag>

What is expected?

It's expected to disable (visual and functional) the tag like it does for buttons https://ng.ant.design/components/button/en#components-button-demo-disabled

What is actually happening?

disabled have no effect

[@.disabled]="true" have no effect

[disabled]="true" causes a fatal error (see below)

Can't bind to 'disabled' since it isn't a known property of 'nz-tag'.
1. If 'nz-tag' is an Angular component and it has 'disabled' input, then verify that it is
part of this module.
2. If 'nz-tag' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

Environment	Info
ng-zorro-antd	9.3.0
Browser	Chrome

---

Disabled appears to have been implemented in #2922 but it doesn't work on at least nz-tag

[hsuanxyz]

@snebjorn Do you want to disable the tag's animation or tag itself?

disable animation
https://ng.ant.design/docs/animations/en

disable tag

not support yet.

[snebjorn]

Sorry. I want to disable the tag itself. So I guess this is a feature request :)

[snebjorn]

What is the currently recommended way to disable a tag?

[hsuanxyz]

Try this

import { Directive } from '@angular/core';

@Directive({
  selector: 'nz-tag[disable]',
  host: {
    '(click)': 'disableClick($event)'
  }
})
export class DisableableTagDirective {

  constructor() { }

  disableClick(e: MouseEvent): void {
    e.preventDefault();
    e.stopPropagation();
  }

nz-tag[disable] {
    cursor: not-allowed;
    color: rgba(0,0,0,.25);
}