Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Template binding does not recognize the 'inert' property. #51879

Closed
examan opened this issue Sep 23, 2023 · 4 comments
Closed

Template binding does not recognize the 'inert' property. #51879

examan opened this issue Sep 23, 2023 · 4 comments
Labels
area: core Issues related to the framework runtime core: binding & interpolation Issue related to property/attribute binding or text interpolation
Milestone
needsTriage

Comments

@examan
Copy link

examan commented Sep 23, 2023 •
edited

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

No

Description

The 'inert' property under HTMLElement can be accessed correctly in TypeScript, but it cannot be used with template binding.

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/i7jj8y?file=src%2Fapp%2Fapp.component.html

Please provide the exception or error you saw

error NG8002: Can't bind to 'inert' since it isn't a known property of 'a'.

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 16.2.3
Node: 16.20.0
Package Manager: npm 9.4.2
OS: linux x64

Angular: 16.2.6
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.3
@angular-devkit/build-angular   16.2.3
@angular-devkit/core            16.2.3
@angular-devkit/schematics      16.2.3
@angular/cli                    16.2.3
@schematics/angular             16.2.3
rxjs                            7.8.1
typescript                      4.9.5
zone.js                         0.13.3

Anything else?

No response
@mfarhani
Copy link

Try [attr.inert] instead [inert]:
<a href="http://angular.io/" [attr.inert]="disabled">Disabled link</a>
it will work.

@examan
Copy link
Author

examan commented Sep 27, 2023 •
edited

Try [attr.inert] instead [inert]: <a href="http://angular.io/" [attr.inert]="disabled">Disabled link</a> it will work.

@mfarhani I know this works, but I think this is a workaround and should be fixed, thank you

@chsagar236
Copy link

chsagar236 commented Oct 2, 2023 •
edited

in app.component.html
use like this

Disabled link

and in app.component.css add css like this

[inert], [inert] * {
opacity: 0.5;
pointer-events: none;
cursor: default;
user-select: none;
}

image
image

@pkozlowski-opensource pkozlowski-opensource added area: core Issues related to the framework runtime core: binding & interpolation Issue related to property/attribute binding or text interpolation labels Oct 9, 2023
@ngbot ngbot bot added this to the needsTriage milestone Oct 9, 2023
@physicx237 physicx237 mentioned this issue Nov 24, 2023
Closed
14 tasks
@alxhub alxhub closed this as completed in dba3e0b Feb 21, 2024
alxhub pushed a commit that referenced this issue Feb 21, 2024
@physicx237 @alxhub
fix(compiler): adding the inert property to the "SCHEMA" array (#53148)
6447c0e 
This change allows template binding "inert" attribute with the following syntax: [inert]="isInert"

Fixes #51879

fixup! fix(compiler): adding the inert property to the "SCHEMA" array

revert: "fixup! fix(compiler): adding the inert property to the "SCHEMA" array"

This reverts commit b637b7c.

This commit is being reverted because the inert property is safe as a boolean attribute

PR Close #53148
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Mar 23, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
area: core Issues related to the framework runtime core: binding & interpolation Issue related to property/attribute binding or text interpolation
Projects
None yet
Milestone
needsTriage
Development

Successfully merging a pull request may close this issue.

fix(compiler): adding the inert property to the "SCHEMA" array physicx237/angular
4 participants
@pkozlowski-opensource @examan @mfarhani @chsagar236