CODEWITHSUNDEEP
angulartypescriptobjectprimeng
infodev
infodev

Reputation: 5235

cannot invoke an expression in Angular

i would create a dynamic menu. For that I use primeng menu panel

I declare my item variable 

 items: MenuItem[]=[];

I have two JS object to integrate to the menu, groupsItem and ejsItem

Here's their format: 

groupsItem  = {

    code:"",
    name:""

}

ejsItem  = {

    code:"",
    name:"",
    codeBusinessGroup:"",
    nameBusinessGroup

}

I would that for every groupsItem.code I check if groupsItem.code==ejsItem.codebusinessGroup in ejsItem list. If yes I add ejsItem.name as a sub menu to groupsItem.name.

For example:

groupsItem  = {
    code:"123",
    name:"Facebook"    
}

ejsItem  = {   
    code:"222",
    name:"Whatapp",
    codeBusinessGroup:"123",
    nameBusinessGroup:"Facebook"    
}

The menu will be :

I have coded a function to create the menu that I have OnInit

createMenu() {
    let groupsItem: any[]=[];
    groupsItem=this.getCacheResults("group");
    let ejsItem: any[];
    ejsItem=this.getCacheResults("ej");
    for(let i=0;i<groupsItem.length;i++) {
        this.items.push({label:groupsItem[i].name});
        console.log("Item",this.items[i])
        for(let j =0;j<ejsItem.length;j++) {
            if(ejsItem[j].codeBusinessGroup==groupsItem[i].code)
                this.items[i].items.push({label:ejsItem[j].name}) // items to add them as sub-menu
        }
    }
}

I got this error :

 ERROR in src/app/shared/left-menu/left-menu.component.ts(115,5): error TS2349: Cannot invoke an expression whose type lacks a call signature. Type '((...items:MenuItem[]) => number) | ((...items: MenuItem[][]) => number)' has no compatible call signatures.

Upvotes: 1

Views: 579

Answers (1)

Titian Cernicova-Dragomir
Titian Cernicova-Dragomir

Reputation: 249506

The items property of MenuItem is defined as MenuItem[] | MenuItem[][] (meaning it can either be an array of MenuItem or an array of arrays of MenuItem) so yo can't call push on a property with such a type, because it is not clear to the compiler if you are trying to push into a MenuItem[]or a MenuItem[][]

The simplest solution is to create the array of type MenuItem[] and then assign it directly 

let childItems: MenuItem[] = [];
for (let j = 0; j < ejsItem.length; j++) {
    if (ejsItem[j].codeBusinessGroup == groupsItem[i].code) {
        childItems.push({ label: ejsItem[j].name }) // items to add them as sub-menu
    }
}
this.items[i].items = childItems;

Upvotes: 1

Related Questions