Angular 22 compatibility, EventData types are not correctly inferred from templates
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 45/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- angular, typescript
- Domain
- frontend
Research direction
Start by reproducing the template-checking errors with Angular 22 and the shown angularCompilerOptions settings. Compare strictDomEventTypes true and strictDomLocalRefTypes true using the $event and #idElement examples. Done means NativeScript event handlers infer EventData-derived types and template references are recognized as View rather than HTMLElement.
Written by the indexing model from the issue text.
Description
Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):
✔ Component nativescript has 9.0.6 version and is up to date.
✔ Component @nativescript/core has 9.0.20 version and is up to date.
✔ Component @nativescript/ios has 9.0.3 version and is up to date.
✔ Component @nativescript/android has 9.0.4 version and is up to date.
"@angular/animations": "22.0.1",
"@angular/common": "22.0.1",
"@angular/compiler": "22.0.1",
"@angular/core": "22.0.1",
"@angular/forms": "22.0.1",
"@angular/platform-browser": "22.0.1",
"@angular/platform-browser-dynamic": "22.0.1",
"@angular/router": "22.0.1",
"@angular-devkit/build-angular": "22.0.1",
"@angular/build": "22.0.1",
"@ngtools/webpack": "22.0.1",
"typescript": "6.0.3",
"@nativescript/angular": "22.0.0-dev.0",
"@nativescript/core": "9.0.20",
"@nativescript/iqkeyboardmanager": "3.0.0",
"@nativescript/localize": "5.2.0",
"@nativescript/secure-storage": "4.0.1",
"@nativescript/theme": "3.1.0",
"rxjs": "7.8.2",
"sass": "1.100.0",
"typescript": "6.0.3"
Describe the bug
With the Angular 22 type checking I see 2 compatibility problems, both related to template checks. I need to say, my app is running perfectly fine. The problems I am seeing are from type checking only!
- this can be seen when activating
"angularCompilerOptions": {"strictDomEventTypes": true}
It seems like angular cannot narrow down parameter types. I get about 400 errors related to the usage of $event in method calls. it is everywhere interpretet as Event rather than the related Nativescript EventData or derived type.. Below some examples to understand the pattern
error TS2345: Argument of type 'Event' is not assignable to parameter of type 'EventData'.
Type 'Event' is missing the following properties from type 'EventData': eventName, object
2 (shouldOverrideUrlLoading)="onOverrideUrlLoading($event)" (loaded)="onPlayerLoaded($event)" iosAllowInlineMediaPlayback="true" backgroundColor="black">
ERROR in src/app/modules/selection/pages/add-edit-meal/add-edit-meal.component.html:35:105 - error TS2345: Argument of type 'Event' is not assignable to parameter of type 'EventData'.
Type 'Event' is missing the following properties from type 'EventData': eventName, object
35 (textChange)="onCheckMealChange($event)" class="text-field recipe-field" (tap)="onTextFieldSetFocus($event)">
- Second problem can be seen when activating
"angularCompilerOptions": {"strictDomEventTypes": false,}
"strictDomLocalRefTypes": true,
When I try to use a template reference in a function
<Label #idElement (tap)="myFunction(idElement)">
and want to use it in component as
public myFunction(arg:View){...}
I get the error
Argument of type 'HTMLElement' is not assignable to parameter of type 'View'.
- Dominant language
- TypeScript
- Stars
- 55
- Forks
- 13
- Avg merge
- 16m
- Merged PRs (30d)
- 1
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from NativeScript/angular
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
NativeScript/angular#164 ·
-
My types are gone Open
Difficulty 2/5 1-3 hours Newbie friendliness 45/100
NativeScript/angular#163 · 1 comment ·
-
Difficulty 4/5 3-5 days Newbie friendliness 38/100
NativeScript/angular#158 · 1 reaction ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 35/100
NativeScript/angular#155 ·
-
NativeScript/angular#154 · 1 assignee ·
All issues in NativeScript/angular
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
ontola/atomic-server#1625 ·
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
melgarafael/DeskcommCRM#1451 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 82/100
-
bug via-triage
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
-
bot:ai-assisted component:compact-js status:untriaged
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
midnightntwrk/midnight-sdk#403 ·