Experiencing a typeerror with the Event attribute

I encountered an issue while trying to target an event. Here is what I attempted:

  public gotoPage(event: Event): void {
    const gettest = (event.target as HTMLElement)?.getAttribute('href');
    if (href) {
      const testModule = "value1"
      if (ssoModule) {
        event.preventDefault();
      }
    }
  }

HTML :

<ion-card-content>
  <ion-item class="no-padding" (click)="gotoPage($event)">
    <div>
{{test}}
    </div>
  </ion-item>
</ion-card-content>

However, the following errors occurred:

Property 'target' does not exist on type 'Event_2'.
Property 'target' does not exist on type 'RouterEvent'.
Property 'preventDefault' does not exist on type 'Event_2'.
Property 'preventDefault' does not exist on type 'RouterEvent'.

Currently, I am using type any to resolve the error. Is there a better solution to fix this issue?

Answer №1

Have you considered the possibility that your Event type may have been imported from another source?

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Which is better: Angular module for each page or component for each page?

We are getting started with Angular 8 and have a vision for a web application that includes: A navigation bar at the top with dropdown menu items leading to different UI pages. The main section will display each page, such as: - Sales section ...

What causes TypeScript to be unable to locate declared constants?

I am facing an issue with the following simple code snippet: const getMethod = 'get'; const postMethod = 'post'; export type RequestMethod = getMethod | postMethod; When I try this code in TypeScript Playground, it shows an error sta ...

Tips for incorporating nested generics in Typescript

Currently, I am developing a straightforward activity execution framework that allows developers to define activities which can be executed within a workflow. To enhance type safety and boost developer productivity by utilizing type hints, I aim to incorp ...

`Can you provide guidance on implementing font-awesome icons on NativeScript?`

I can't seem to figure out how to incorporate font-awesome icons into my app that I'm developing with NativeScript. I've experimented with different methods, such as trying to include the unicode of the desired icon in the hint attribute li ...

Encountered an unexpected token error while using Jest with TypeScript, expecting a semicolon instead

I have been struggling to configure jest for use with typescript and despite trying several solutions, I am still facing issues. The error SyntaxError: Unexpected token, expected ";" keeps popping up, indicating that the configuration may not be compatible ...

What is the solution for combining multiple String Literal union types?

I'm dealing with two distinct types of string literals: type X = { type: "A1", value: number } | { type: "A2", value: string }; type Y = { type: "A1", test: (value: number) => void; } | { type: "A2", test: (valu ...

Refreshing Angular 2 + Firebase app causes user to be logged out

Just diving into Angular2, Firebase, and SPAs for the first time. I've been tasked with enhancing a Angular2 (with Firebase email&pw auth) application by adding some new features. The app primarily consists of a blog (main page), a shop (/shop), a ...

What is the process for developing a bespoke TypeScript Declaration library and integrating it into my projects through NPM or GitHub Packages?

Project Description I am currently developing a customized TypeScript type declaration library that will be utilized in various projects. However, I am encountering an issue when it comes to importing this TypeScript library into my projects. Although it ...

encountered difficulties while attempting to install npm i due to node-gyp errors

When attempting to run npm i --force, I encounter the following error: pm ERR! code 1 npm ERR! path /Users/moblizeit/GitHub/code-repo/apps/business-card-scanner/admin/businesscardadmin/node_modules/grpc npm ERR! command failed npm ERR! command sh -c -- nod ...

What is the reason for TypeScript disabling unsecure/non-strict compiler rules by default?

Recently, I found myself having to enable a slew of compiler options in my application: "alwaysStrict": true, "extendedDiagnostics": true, "noFallthroughCasesInSwitch": true, "noImplicitAny", true, "noImplicitThis", true, "noImplicitReturns": true, "noUnu ...

What sets React.HTMLProps<HTMLDivElement> apart from React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>?

Exploring the differences between interfaces and types in React: interface Properties1 extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {} interface Properties2 extends React.HTMLProps<HTMLDivElement> ...

Customize stepper background color in Angular Material based on specific conditions

I am working on a project using Angular Material and I want to dynamically change the color of the stepper based on different states. For example: state: OK (should be green) state: REFUSED (should be red) Here is what I have done so far: <mat-horizo ...

The AngularJS 2 TypeScript application has been permanently relocated

https://i.stack.imgur.com/I3RVr.png Every time I attempt to launch my application, it throws multiple errors: The first error message reads as follows: SyntaxError: class is a reserved identifier in the class thumbnail Here's the snippet of code ...

Consolidate type definition within a tsx file using VS Code

Whenever I define a type in a TypeScript file (.ts) on VS Code, I notice that there is no option to collapse the definition. Here's an example: export type Test = { someValue: string, someOtherValue: string, yetAnotherValue: string }; I ...

Is it possible to use string indexes with jQuery each method in Typescript?

When running a jQuery loop in Typescript, I encountered an issue where the index was being reported as a string. $.each(locations, (index, marker) => { if(this.options && this.options.bounds_marker_limit) { if(index <= (this.opt ...

Guide on extracting FormData from a POST request in Node.js using Multer

I have a specific challenge where I need to store formData on a mongodb schema, using nodejs and express for the backend, along with multer as middleware. This particular formData consists of both a string and a blob. My main issue is capturing and saving ...

What is the process of creating a typeorm relationship between orders and products?

My Orders Entity file in TypeOrm looks like this: @Entity('orders') export class OrdersEntity { @PrimaryGeneratedColumn('uuid') id: string; @CreateDateColumn() created: Date; @UpdateDateColumn() updated: Date; @Column('t ...

An error has occurred in the Next.js App: createContext function is not defined

While developing a Next.js application, I keep encountering the same error message TypeError: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function every time I try to run my app using npm run dev. This issue arises when attempting to co ...

Invalid for the purpose of storage

Encountering the following error message: The dollar ($) prefixed field '$size' in 'analytics.visits.amounts..$size' is not valid for storage. return Manager.updateMany({}, { $push: { & ...

Implementing NestJS: Integrating TypeORM Datasource without relying on class dependency injection

I have a unique situation that requires some help. Our team is in the process of integrating nestjs into our current express codebase. Previously, we were using Typeorm 0.2 and recently upgraded to 0.3. Due to the fact that we utilize functions instead of ...