Closed
Description
Which @angular/* package(s) are the source of the bug?
animations
Is this a regression?
No
Description
a simple reproduction
app.config.ts
export const appConfig: ApplicationConfig = {
providers: [provideAnimationsAsync(), ɵprovideZonelessChangeDetection()]
};
app.component.ts
@Component({
selector: 'app-root',
standalone: true,
imports: [],
templateUrl: './app.component.html',
styleUrl: './app.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush,
animations: [
trigger('highlight', [
state('false', style({ 'background-color': 'red', color: 'white' })),
])
]
})
export class AppComponent {
highlight = signal(false);
}
app.component.html
<h1 [@highlight]="highlight()">Hello World</h1>
results:
if no apply ɵprovideZonelessChangeDetection()
if apply ɵprovideZonelessChangeDetection()
Please provide a link to a minimal reproduction of the bug
https://github.com/keatkeat87/zoneless-animation-issue
Please provide the exception or error you saw
No response
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 17.3.0
Node: 20.11.1
Package Manager: yarn 1.22.19
OS: win32 x64
Angular: 17.3.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1703.0
@angular-devkit/build-angular 17.3.0
@angular-devkit/core 17.3.0
@angular-devkit/schematics 17.3.0
@schematics/angular 17.3.0
rxjs 7.8.1
typescript 5.4.2
zone.js 0.14.4
Anything else?
No response
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Metadata
Assignees
Labels
A relatively minor issue that is not relevant to core functionsA relatively minor issue that is not relevant to core functionsIssues related to the framework runtimeIssues related to the framework runtime