AngularJS ng-init not initializing variable globally

Question

I am using ng-repeat of angularjs directive to load the array which have JSON value store in it. and value has subarray also.

<div ng-repeat="data in MENULIST"  >  //MENULIST have array(Data)

after checking some conditions like (if:condition).

<div ng-if="(data.SubMenu.length >0)" ng-init = "MENULIST = data.SubMenu"></div>

but that assignment or initialization is not been done globally to MENULIST it limited to this div Only.

ng-repeat stop after printing two main array elements.

not printing Sub Element of Array Element.

actually, I am trying to make and tree structure in the sidebar that has menu and sub menus also.

Can you explain it bit more, I don't understand *why inner assign should update global variable*. Basically It won't work because `ng-if` does create a child scope. — Pankaj Parkar, Oct 05 '18 at 09:34
actually on if condition I am trying to override that MENULIST with sub array element .so that it will print sub-element also. but the problem is that it has limited overridden MENULIST only for that div which have if condition not for out side of that div — MM Furkan, Oct 05 '18 at 09:40

score 0 · Answer 1 · edited Oct 05 '18 at 18:36

Besides two-way binding should work for you I believe calling some function is more straightforward way(especially since you can create this function in scope of particular controller - so it would be much easier to get the point)

<div ng-if="(data.SubMenu.length >0)"
     ng-init = "someController.setMenuList(data.SubMenu)">
</div>

Another "angular-way" is adding explicit watcher to data.Submenu.length in component's JS code

$scope.$watch('data.Submenu.length', function (value, oldValue) {
    if (!value && oldValue) {
        // do your init
    }
});

AngularJS ng-init not initializing variable globally

1 Answers1