creating horizontal menu with angularjs - angularjs

Question

I want to create a menu like this but without using ng-repeat:
<ul class="sidebar-navi">
<li ng-repeat="item in items" ng-click="showChilds(item)">
<i class="fa fa-angle-left sidebar-nav-indicator sidebar-nav-mini-hide"></i><i class="fa fa-cogs sidebar-nav-icon"></i>{{item.name}}
<ul>
<li ng-show="item.active">
<span>First</span>
</li>
<li ng-show="item.active">
<span>Second</span>
</li>
</ul>
</li>
</ul>
the problem is that I didn't find a way to pass parameter to this function showChilds (the current li) I tried to work with id but it didn't work:
<ul class="sidebar-navi">
<li id="first" ng-click="showChilds(first)">
<i class="fa fa-angle-left sidebar-nav-indicator sidebar-nav-mini-hide"></i><i class="fa fa-cogs sidebar-nav-icon"></i>1
<ul>
<li ng-show="first.active">
<span>First</span>
</li>
<li ng-show="first.active">
<span>Second</span>
</li>
</ul>
</li>
<li id="second" ng-click="showChilds(second)">
<i class="fa fa-angle-left sidebar-nav-indicator sidebar-nav-mini-hide"></i><i class="fa fa-cogs sidebar-nav-icon"></i>2
<ul>
<li ng-show="second.active">
<span>First</span>
</li>
<li ng-show="second.active">
<span>Second</span>
</li>
</ul>
</li>
</ul>
and my controller will contain only this function
$scope.showChilds = function (item) {
item.active = !item.active
}
I don't want to use $scope.items anymore

Answer 1

I have updated your HTML. If you are not using ng-repeat then you can use ng-init to initialize one variable and toggle that variable on ng-click to show/hide sub menus. Your updated sample is here
<ul class="sidebar-navi">
<li id="first" ng-click="first = !first" ng-init="first = false">
<i class="fa fa-angle-left sidebar-nav-indicator sidebar-nav-mini-hide"></i><i class="fa fa-cogs sidebar-nav-icon"></i>1
<ul>
<li ng-show="first">
<span>First</span>
</li>
<li ng-show="first">
<span>Second</span>
</li>
</ul>
</li>
<li id="second" ng-click="second = !second" ng-init="second = false">
<i class="fa fa-angle-left sidebar-nav-indicator sidebar-nav-mini-hide"></i><i class="fa fa-cogs sidebar-nav-icon"></i>2
<ul>
<li ng-show="second">
<span>First</span>
</li>
<li ng-show="second">
<span>Second</span>
</li>
</ul>
</li>
</ul>