matTabLink `disabled` input should be `matTabLinkDisabled`
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
#### Reproduction
Use StackBlitz to reproduce your issue: https://stackblitz.com/edit/angular-zju32k
Steps to reproduce:
1. Put a tooltip on a `matTabLink`
2. Disabled the `matTabLink`
#### Expected Behavior
Tab should be disabled, and tooltip should show.
#### Actual Behavior
Tooltip did not show.
#### Notes/Thoughts
If the input is changed to `matTabLinkDisabled`, then `disabled` and `[disabled]="true"` should still be able to work. However, it would also be possible to use `matTabLinkDisabled`, which would make it possible to disable the `MatTabLink` specifically, without disabling any other directive on the element.
I *believe* this would be a non breaking change, as the input is declared in the `inputs` field on component:
```typescript
@Directive({
selector: '[mat-tab-link], [matTabLink]',
exportAs: 'matTabLink',
inputs: ['disabled', 'disableRipple', 'tabIndex'], // <== HERE
host: {
'class': 'mat-tab-link',
'[attr.aria-current]': 'active ? "page" : null',
'[attr.aria-disabled]': 'disabled',
'[attr.tabIndex]': 'tabIndex',
'[class.mat-tab-disabled]': 'disabled',
'[class.mat-tab-label-active]': 'active',
}
})
export class MatTabLink
```
So *my understanding* is right now, you can’t read the disabled field by name anyways.
#### Environment
- Angular: 8.2.11
- CDK/Material: 8.2.1
- Browser(s): Version 77.0.3865.120 (Official Build) (64-bit)
- Operating System (e.g. Windows, macOS, Ubuntu): Debian Rodette
Beitragsleitfaden
Rechercherichtung
Beginne mit der im Issue gezeigten StackBlitz-Reproduktion und der Deklaration der MatTabLink-Direktive und konzentriere dich auf die Interaktion zwischen ihrem disabled-Input und dem Tooltip. Als erledigt gilt, wenn ein deaktivierter Tab-Link weiterhin seinen Tooltip anzeigt, während sowohl disabled als auch matTabLinkDisabled wie beschrieben verwendbar bleiben.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 48/100