Binds data to all child li items on ng-click

See more:

AngularJs

What I tried:-

**What is Problem:-**
**Menu Example:-**
Network1
Devices
Object1
Object2
Network2
Devices2
Object21
Object22

Here the issue is, if I click on "Network1", then ***it binds both the children's of Network1 and Network2 with same data* and same happens with Devices**. If I click on Devices, then it binds Devices objects as well as Devices2 objects.

Please let me know the solution..
Thanks in Advance

What I have tried:

<ul class="" id="leftMenu">
    <li ng-repeat="(networkKey, networkValue) in menuValue track by $index"   class="has-chield"
        ><a href="#" ng-click="divVerticalMenuClickEventHandler($event, networkValue, 'NetworkLevel', '')" class="normal-anchor-color">
            Network {{$index+1}}<span class="sub-arrow"> </span></a>
        <ul class="" style="">
            <li ng-repeat="(deviceAccessPointKey, deviceAccessPointValue) in deviceAccessPointItems track by $index"    class="has-chield"
                ><a href="#" ng-click="divVerticalMenuClickEventHandler($event, networkValue +'/' +deviceAccessPointValue.name , 'DeviceLevel', deviceAccessPointValue.ref)" class="normal-anchor-color">
                    {{capitalizeFirstLetter(deviceAccessPointValue.name)}}<span class="sub-arrow"> </span></a>
                    <div ng-repeat="(objectkey, objectValue) in objectListItems">
                <ul class="" style="">
                    <li ng-repeat="(objectListKey, objectListValue) in objectValue track by $index | orderBy:sortMenu"
                        class=""><a href="#"  ng-click="divVerticalMenuClickEventHandler($event, objectListValue, 'ObjectListLevel', '')" class="normal-anchor-color">
                           {{GetUpdatedObjectname(objectListValue)}}<span> </span></a></li>
                </ul>
                </div>
            </li>
        </ul>
    </li>
</ul>

Controller binds this menu dynamically.

$scope.menuItems = payload.data;