CODEWITHSUNDEEP
angulartypescript
Bagaboo
Bagaboo

Reputation: 363

Cannot read property 'push' of undefined even though is is instantiated

I have this class where I instantiate the SelectedNames array. I have tried instantiating it at the constructor method signature, and in the constructor method body.

userstate.model.ts

export class UserState{
    constructor(
        public StartsWithFilters: string[],
        public EndsWithFilters: string[],
        public ContainsFilters: string[],
        public EqualsFilters: string[],
        public SelectedNames: string[],
        public CurrentName : string
    ){
        this.SelectedNames = [];
    }
}

In this class where I instantiate the UserState.

home.component.ts

export class HomeComponent implements OnInit {
    userState : UserState = {};

    constructor(
        private nameService : NameService,
        public auth : AuthService) {
    }

    getNextName(){
        this.nameService.getNextName()
            .subscribe(
                name => this.userState.CurrentName = name.NameText,
                error => alert("getNextName: error")
            );
    }

    selectName(){
        this.userState.SelectedNames.push(this.userState.CurrentName);
    }

    ngOnInit() { 
    }

    btnNextClickedEvent(): void {
        this.getNextName();
    }

    btnSelectClickedEvent(): void {
        this.selectName();
    }
}

NameService, Authentication service, home.component.html displays {{userState.CurrentName}}, and getNextName() works fine. 

Error in selectName(): Cannot read property 'push' of undefined.

As if SelectedNames is undefined.

What gives?

Cheers

Upvotes: 0

Views: 138

Answers (1)

Bagaboo
Bagaboo

Reputation: 363

Ok, i figured it out.

I need to instantiate UserState like this:

userState : UserState = new UserState();

In order to construct it properly.

Upvotes: 1

Related Questions