GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — Custom property style bindings ignore static and `[style]` values of same name since 22.1 · Issue #71806 · angular/angular

Custom property style bindings ignore static and [style] values of same name since 22.1 #71806

New issue
Copy link
New issue
Copy link
Open
Open
Custom property style bindings ignore static and [style] values of same name since 22.1#71806
Copy link
Labels
area: compilerIssues related to `ngc`, Angular's template compilerIssues related to `ngc`, Angular's template compiler
Milestone
needsTriage

Description

@thekhegay
thekhegay
opened on Nov 4, 2026
Issue body actions

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

compiler

Is this a regression?

Yes, works in 22.0.8, broken in 22.2.4 and 22.3.0-next.3. Came with #68846

Description

Hit this in my ui lib, had to move component inputs to separate variable

[style.--x] compiles to key --%NS%x, but static style="--x: red" and [style]="'--x: red'" keep --x. Styling priority looks values up by key, so these never mathc and binding stops seeing value of same name. [style.color] is not affected. No provideCssVarNamespacing() needed to hit this

  • host binding [style.--x] now overwrites value author set on component element, before author won
  • undefined no longer falls back to static or [style] value, element ends up without --x
case bound value 22.0.8 22.2.4 same case with color, 22.2.4
<my-cmp style="--x: red"> + host [style.--x] blue --x: red --x: blue color: red
<my-cmp style="--x: red"> + host [style.--x] undefined --x: red empty color: red
<i style="--x: red" [style.--x]="v"> undefined --x: red empty color: red
<i [style]="'--x: red'" [style.--x]="v"> undefined --x: red empty color: red
host style: '--x: red' + host [style.--x] undefined --x: red empty color: red

With provideCssVarNamespacing('ns') both stay on element: --x: red; --ns_x: blue

Please provide a link to a minimal reproduction of the bug

@Component({ selector: 'my-cmp', template: '', host: { '[style.--x]': 'v' } })
class MyCmp {
  @Input() v?: string;
}

@Component({ selector: 'app-root', imports: [MyCmp], template: `<my-cmp style="--x: red" v="blue" />` })
class App {}

getAttribute('style') on my-cmp: --x: red in 22.0.8, --x: blue in 22.2.4 and 22.3.0-next.3

Please provide the exception or error you saw

None

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

@angular/core 22.0.8, 22.2.4 and 22.3.0-next.3, Chromium, JIT

Anything else?

Compliance golden style_bindings/css_custom_properties.js shows same split: --camel-case in consts, --%NS%camelCase in ɵɵstyleProp

Activity

  1. angular-robot
    added
    area: compilerIssues related to `ngc`, Angular's template compilerIssues related to `ngc`, Angular's template compiler
    on Nov 4, 2026
  2. angular-robot
    added this to the needsTriage milestone on Nov 4, 2026
  3. JeanMeche commented on Nov 4, 2026

    @JeanMeche
    JeanMeche
    on Nov 4, 2026
    Member
    More actions

    Is this the same report as #70064 ?

  4. thekhegay commented on Nov 4, 2026

    @thekhegay
    thekhegay
    on Nov 4, 2026
    ContributorAuthor
    More actions

    no, different one. #70064 is about styles rewrite and needs provideCssVarNamespacing(). Here nothing opts in: [style.--x] gets key --%NS%x while static style and [style] stay --x, so host binding overwrites author value and undefined doesnt fall back. Both come from #68846 though

    can send fix if you tell me how static --x should behave with namespacing

    Reacted by Shuaib Hasan Akib
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: compilerIssues related to `ngc`, Angular's template compilerIssues related to `ngc`, Angular's template compiler

    Type

    No type

    Projects

    No projects

      Milestone

      • needsTriageNo due date

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions

      You are visitor 01402503 — GeezerVison does not store the pages you look up.
      Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.