Скачать или смотреть How to Fix Argument of type Event Error in NativeScript Angular Apps

Discover how to resolve the `Argument of type Event is not assignable to parameter of type PanGestureEventData` error in your NativeScript Angular application by adjusting TypeScript configuration settings.
---
This video is based on the question https://stackoverflow.com/q/72373337/ asked by the user 'ClassY' ( https://stackoverflow.com/u/10421110/ ) and on the answer https://stackoverflow.com/a/72600528/ provided by the user 'ClassY' ( https://stackoverflow.com/u/10421110/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: Argument of type Event is not assignable to parameter of type PanGestureEventData

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
How to Fix Argument of type Event Error in NativeScript Angular Apps

When you're building applications in NativeScript using Angular, you may encounter various errors that can halt your progress. One common issue developers face is the error:

[[See Video to Reveal this Text or Code Snippet]]

This error typically arises when binding touch events in your HTML. In this guide, we’ll explore the issue and provide a straightforward solution to resolve it.

Understanding the Error

The error message means that the type of event you are using does not match the expected type. In this case, the event generated by your touch interactions in the HTML is of type Event, while your method onPanMoveContainer expects an argument of type PanGestureEventData.

Key Points from the Error:

PanGestureEventData: This is a specific type that includes properties like deltaX, deltaY, and state. It provides more details about the pan gesture.

Missing Properties: The basic Event type does not contain the necessary properties that PanGestureEventData requires.

The Root Cause

Component Code Overview

Let’s recount what your code looked like:

[[See Video to Reveal this Text or Code Snippet]]

The binding (pan)="onPanMoveContainer($event)" expects $event to be of type PanGestureEventData.

The Component Implementation

Here’s the problematic piece of the component where this error arises:

[[See Video to Reveal this Text or Code Snippet]]

The Solution

Fortunately, the solution to this issue is quite simple:

Disable Strict Templates

You can resolve the error by disabling the strictTemplates option in your TypeScript configuration file:

Open your tsconfig.json file.

Find the compilerOptions section.

Set the strictTemplates option to false.

Here is how it should look:

[[See Video to Reveal this Text or Code Snippet]]

Impact of the Solution

By disabling strictTemplates, you allow more flexibility in how types are checked, which can help eliminate the type mismatch errors encountered in your NativeScript Angular applications.

Conclusion

In NativeScript Angular development, encountering type-related issues can be frustrating, but they can often be resolved with simple changes to your TypeScript configuration settings. By following the steps outlined in this guide, you can easily fix the Argument of type 'Event' is not assignable to parameter of type 'PanGestureEventData' error.

Remember to keep your TypeScript configurations in mind as you build your applications, as they can greatly affect your development experience. Happy coding!