error TS2339: Property 'email' does not exist on type 'Object'

Question

I'm using angular 5 and i got an error, heres the code :

signIn(provider) {
    this._auth.login(provider).subscribe(
      (data) => {
        console.log(data);
        this.hideForm = false;

        this.emaill = data.email;
        this.nom = data.last_name;
        this.prenom = data.first_name;
        this.profileImage = data.image;
    })
}

The error is :

src/app/authentification/authentification.component.ts(34,28): error TS2339: Property 'email' does not exist on type 'Object'. src/app/authentification/authentification.component.ts(35,25): error TS2339: Property 'last_name' does not exist on type 'Object'. src/app/authentification/authentification.component.ts(36,28): error TS2339: Property 'first_name' does not exist on type 'Object'. src/app/authentification/authentification.component.ts(37,34): error TS2339: Property 'image' does not exist on type 'Object'.

Answer 1

Property 'hostname' does not exist on type 'Object'.

I'm using Vue and typescript, error occurred on debug when trying to console.log this.dropdownItems[0].hostname after loading some data in. The error for me looks to be a typescript type check on the declaration of the variable:

dropdownItems: Array<Object> = []

should have been:

dropdownItems: any[] = []

Derived from: https://www.reddit.com/r/ionic/comments/9cxc79/property_courses_does_not_exist_on_type_object/

Answer 2

The Most upvoted answer is not great because it defeats the whole purpose of Typescript also mentioned by @Alex Lomia

Solution for this are -

1. To fix this, create an interface that describes your schema and extends mongoose.Document: check this similar question here - similar question

2. Use Javascript instead of TypeScript , if someone is using NestJS in the backend is most likely to run into this error so if you don't want to go through the process of making interfaces and DTO's use javascript , also with javascript the built file will be smaller too .

Answer 3

or better practice to use interfaces. you may declare the interface:

export interface DataI {

 email: string;
 ...
 constructor(...){this.email = email .....}

and then use it as type

Answer 4

This same error occurred in my Nodejs Typescript project -

Code -

app.post('/form-submit', (req, res) => {
   const errors = {};
   if (...condition) {
      errors.email = ['Email is not valid.'];
   }
});

Error -

Property 'email' does not exist on type '{}'.ts(2339)

Solution (add :any and the error resolve) -

const errors:any = {};

Answer 5

You can use data:any:

signIn(provider) {
    this._auth.login(provider).subscribe(
      (data:any) => {
        console.log(data);
        this.hideForm = false;

        this.emaill = data.email;
        this.nom = data.last_name;
        this.prenom = data.first_name;
        this.profileImage = data.image;
    })
}

Now it will work properly, because i had same problem.

Answer 6

The error occures because data is of the type Object which has none of your properties. You could check if the Object has your property and use it:

if (data.hasOwnProperty('email')) this.email = data['email'];

Answer 7

check the condition for your object is empty or not

if(data!==null && data!==undefined && data.email !==undefined)
{
    this.emaill = data.email;
    this.nom = data.last_name;
    this.prenom = data.first_name;
    this.profileImage = data.image;
}

Answer 8

I personally encountered this problem. The original code was :

if (response.data !== 'undefined') {
    // ...
}

And should have been :

if (response["data"] !== 'undefined') {
    // ...
}

Answer 9

use of [] gives an excellent way to use actual value of variable as key/property while accessing JavaScript objects.

e.g.- someObject[someKey]

(data: object) => {
    this.emaill = data['email'];
}

if still error exists or want future proof coding, add checking like -

if (data.hasOwnProperty('email')) {
    this.email = data['email'];
}