Angular 8: is not a function, how to fix

Question

I wrote a function in a class which returns data, When calling this from another component, receiving error below, the other class members show up in debugger, but it cannot recognize the function.

Getting error

TypeError: this.addressTestData.getValidateAddressLine is not a function

public addressTestData: AddressMailingData = new AddressMailingData();

validateaddress = this.addressTestData.getValidateAddressLine();

Stop doing such destructive comment-pastes. Edit your question, take some time to make it right, than save changes and wait for help. — Antoniossss, Nov 14 '19 at 01:43
@SailorLuvBoat This is similar: https://stackoverflow.com/q/50551649/483655 — Merenzo, Nov 14 '19 at 05:12

Antoniossss · Accepted Answer · 2019-11-14T01:16:02.697

1

this.addressTestData is not of type AddressMailingData

Your debug screen shows it is just an OBJECT

edited Nov 14 '19 at 01:16

answered Nov 14 '19 at 01:07

Antoniossss

31,590
6
57
99

That does not matter how you declared it. In Typescript there is no runtime type controll so it can be anyting - even plain javascript object. – Antoniossss Nov 14 '19 at 01:15
1

You need to create that object with `new` keyword so it will be indeed an instance of given class. – Antoniossss Nov 14 '19 at 01:17
No idea, you didnt show code for instance creation. – Antoniossss Nov 14 '19 at 01:18
No code - hard to help. Anyway answer is valid - its of different type – Antoniossss Nov 14 '19 at 01:28
1

I checked out this link, and it worked, thanks https://stackoverflow.com/questions/49997765/reactive-forms-correctly-convert-form-value-to-model-object – Nov 14 '19 at 02:33

score 0 · Answer 2 · answered Nov 14 '19 at 02:47

@SailorLuvBoat: Yes, as per your comment, the problem lies with the assumption that currentMessage is an AddressMailingData instance - it isn't!

It is a plain javascript object, with (probably) all the same properties as AddressMailingData, but without any of the methods.

You will need to instantiate a new AddressMailingData object, then copy all of the property values from currentMessage into it. You could use the javascript method Object.assign to do this simply.

You could change your AddressMailingData constructor to this:

export class AddressMailingData {
    constructor(data?: any) {
        Object.assign(this, data);
    }

And then your subscription handler to this:

this.addressMailingStandardService.currentMessage.subscribe(currentMessage => { 
  this.addressStandardMessage = new AddressMailingData(currentMessage);
  ...
});

Then this.addressStandardMessage will contain a valid AddressMailingData instance, and you will be able to access your .getValidateAddressLine() method.

Angular 8: is not a function, how to fix

2 Answers2