CODEWITHSUNDEEP
angulartypescript
Juicy
Juicy

Reputation: 12520

Getting an `undefined` error when trying to assign values to attributes

I'm getting an undefined error when trying to assign values to the properties of a custom class.

I defined a FileArgument class as such:

export class FileArgument {
  name: string;
  path: string;
  file: File;
}

I want to use it in my component to store information about a file type input field. My component looks like this:

export class InputModuleComponent {
    private fileArgument: FileArgument;

    onChange(event): void {
        console.log('input-module.component - onChange()');

        this.fileArgument.file = event.originalTarget.files[0];
        this.fileArgument.name = event.originalTarget.id;
        console.log(this.fileArgument);
    }
}

And my simplified html looks like:

<input 
    name="{{arg.name}}" 
    id="{{ arg.name }}"
    type="file"

    [(ngModel)]="moduleArguments[arg.name]"
    (change)="onChange($event)" 
>

When the onChange method is triggered, I get the following error:

Error: Error in http://localhost:3000/app/input/input-module/input-module.component.js class InputModuleComponent - inline template:16:9 caused by: this.fileArgument is undefined

If I comment out the lines where I try to assign values to this.fileArgument.file and .name my app works without errors.

EDIT: Please note the error definitely comes from assigning values to fileArgument.file/name. The event.originalTarget.files/id return values without error.

Upvotes: 0

Views: 206

Answers (1)

j2L4e
j2L4e

Reputation: 7050

You're only assigning a type. You also need to assign an instance of the object:

private fileArgument: FileArgument = new FileArgument();

Upvotes: 1

Related Questions