Ignore Typescript Errors "property does not exist on value of type"

I know the question is already closed but I've found it searching for same TypeScriptException, maybe some one else hit this question searching for this problem. The problem lays in missing TypeScript typing:

var coordinates = outerElement[0].getBBox();

Throws The property 'getBBox' does not exist on value of type 'HTMLElement'.

var outerHtmlElement: any = outerElement[0];
var coordinates = outerHtmlElement.getBBox();

Edit, late 2016

Since TypeScript 1.6, the prefered casting operator is as, so those lines can be squashed into:

let coordinates = (outerElement[0] as any).getBBox();

Other solutions

Of course if you'd like to do it right, which is an overkill sometimes, you can:

Create own interface which simply extends HTMLElement Introduce own typing which extends HTMLElement

---

The quick and dirty solution is to explicitly cast to any

(y as any).x

The "advantage" is that, the cast being explicit, this will compile even with the noImplicitAny flag set.

The proper solution is to update the typings definition file.

Please note that, when you cast a variable to any, you opt out of type checking for that variable.

Since I am in disclaimer mode, double casting via any combined with a new interface, can be useful in situations where

you do not want to update a broken typings file

and/or you are monkey patching

yet, you still want some form of typing.

Say you want to patch the definition of an instance of y of type OrginalDef with a new property x of type number:

const y: OriginalDef = ...

interface DefWithNewProperties extends OriginalDef {
    x: number
}

const patched = y as any as DefWithNewProperties

patched.x = ....   //will compile

---

You can also use the following trick:

y.x = "some custom property"//gives typescript error

y["x"] = "some custom property"//no errors

Note, that to access x and dont get a typescript error again you need to write it like that y["x"], not y.x. So from this perspective the other options are better.

---

There are several ways to handle this problem. If this object is related to some external library, the best solution would be to find the actual definitions file (great repository here) for that library and reference it, e.g.:

/// <reference path="/path/to/jquery.d.ts" >

Of course, this doesn't apply in many cases.

If you want to 'override' the type system, try the following:

declare var y;

This will let you make any calls you want on var y.

---

When TypeScript thinks that property "x" does not exist on "y", then you can always cast "y" into "any", which will allow you to call anything (like "x") on "y".

Theory

(<any>y).x;

Real World Example

I was getting the error "TS2339: Property 'name' does not exist on type 'Function'" for this code:

let name: string = this.constructor.name;

So I fixed it with:

let name: string = (<any>this).constructor.name;

---

I know it's now 2020, but I couldn't see an answer that satisfied the "ignore" part of the question. Turns out, you can tell TSLint to do just that using a directive;

// @ts-ignore
this.x = this.x.filter(x => x.someProp !== false);

Normally this would throw an error, stating that 'someProp does not exist on type'. With the comment, that error goes away.

This will stop any errors being thrown when compiling and should also stop your IDE complaining at you.

---

Had a problem in Angular2, I was using the local storage to save something and it would not let me.

Solutions:

I had localStorage.city -> error -> Property 'city' does not exist on type 'Storage'.

How to fix it:

localStorage['city'] (localStorage).city (localStorage as any).city

---

A quick fix where nothing else works:

const a.b = 5 // error

const a['b'] = 5 // error if ts-lint rule no-string-literal is enabled

const B = 'b'
const a[B] = 5 // always works

Not good practice but provides a solution without needing to turn off no-string-literal

---

In my particular project I couldn't get it to work, and used declare var $;. Not a clean/recommended solution, it doesnt recognise the JQuery variables, but I had no errors after using that (and had to for my automatic builds to succeed).

---

I was able to get past this in typescript using something like:

let x = [ //data inside array ];
let y = new Map<any, any>();
for (var i=0; i<x.length; i++) {
    y.set(x[i], //value for this key here);
}

This seemed to be the only way that I could use the values inside X as keys for the map Y and compile.

---