menu items from $sp.getMenuItems("SYS_ID") not displaying

[juan casas]

Hello experts!

I am having an issue displaying a menu item using $sp.getMenuItems("SYS_ID") in a widget.

the part of the code that is giving me an issue is the following:

data.items = $sp.getMenuItems("SYS_ID"); 

data.items = [ data.items[0],data.items[1] ] // I overwrote the array for testing purposes

only data.items[1] is displayed in the portal

note: data.items[0] was copied using 'insert' functionality. it was copied from data.items[1]

The items are the following::

data.items[0] = {
    "sp_rectangle_menu": "ABC",
    "color": "default",
    "active": true,
    "label": "BOQAS2",
    "type": "url",
    "sys_tags": "",
    "sys_class_name": "sp_rectangle_menu_item",
    "sys_id": "A1",
    "condition": A_CONDITION_THAT_LOOKS_AT_ROLES,
    "url_target": "",
    "sys_name": "BOQAS2",
    "sys_scope": "global",
    "href": "",
    "items": [{
        "color": "default",
        "active": true,
        "sp_page": "ABC",
        "label": "PUBLIC TEST!",
        "type": "page",
        "sys_tags": "",
        "sys_class_name": "sp_rectangle_menu_item",
        "sys_id": "I1",
        "url_target": "",
        "sys_name": "PUBLIC TEST!",
        "sys_scope": "global",
        "href": "?id=public_test",
        "items": [],
        "order": 100
    }],
    "order": 80
}
 data.items[1] = {
    "sp_rectangle_menu": "ABC",
    "color": "default",
    "active": true,
    "label": "BOQAS",
    "type": "url",
    "sys_tags": "",
    "sys_class_name": "sp_rectangle_menu_item",
    "sys_id": "B2",
    "condition": A_CONDITION_THAT_LOOKS_AT_ROLES,
    "url_target": "",
    "sys_name": "BOQAS",
    "sys_scope": "SYS_ID3",
    "href": "",
    "items": [{
        "color": "default",
        "active": true,
        "label": "     Open Application",
        "type": "url",
        "sys_tags": "",
        "sys_class_name": "sp_rectangle_menu_item",
        "url": "/boqas?id=bu_boqas_application",
        "sys_id": "I2",
        "condition": A_CONDITION_THAT_LOOKS_AT_ROLES,
        "url_target": "_top",
        "sys_name": "     Open Application",
        "sys_scope": "SYS_ID3",
        "href": "/boqas?id=bu_boqas_application",
        "items": [],
        "order": 100
    }],
    "order": 100
}

I know that this is the data being passed in HTML because I printed within the HTML using the following black snip

......<div id="cat-parent">{{data.items[0]}}{{'\n'}}{{data.items[1]}}
...  <div class="panel" ng-repeat="cat in data.items" ng-if="options.menus.indexOf(cat.sys_id) > -1">

the list in the portal is displayed using the red snip 

why is one only displaying?!?!

[juan casas]

I took out ng-if="options.menus.indexOf(cat.sys_id) > -1 and it worked!

what does "ng-if="options.menus.indexOf(cat.sys_id) > -1" do?