javascript - Show / Hide elements with AngularJs -

I was trying to show and hide the element, so when I ; Li & gt; element, I have set ng-show value false for all the elements. If I try to show the value true , then it shows me all the child elements. I just want to show my child for each element:

HTML code:

  and lt; Ul ng-init = "show = false" & gt; & Lt; Li & gt; & Lt; One class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-user" & gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; Div ng-show = "show" & gt; Profile & lt; / Div & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-scope" & gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; Div ng-show = "show" & gt; Scope & lt; / Div & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-job" & gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; Div ng-show = "show" & gt; Jobs & lt; / Div & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-login" & gt; & Lt; / Div & gt; & Lt; Div ng-show = "show" & gt; Login & lt; / Div & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; Class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-register" & gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; Div ng-show = "show" & gt; Register & lt; / Div & gt; & Lt; / Li & gt; & Lt; / Ul & gt;  

JQUERY CODE:

  $ ('ul li'). Mousecenter (function () {$ (this). Children ('div'). Show ();}); $ ('Ul li'). Mouseleave (function () {$ (this). Child ('div') Hide ();});  

This is not an angular way. You should do this.

JS

  angular.module ("first app") controller ("myCtrl", function ($ scope) {$ Scope.allMenu = ["Profile", "scope", "job", "login", "register"];});  

HTML

  & lt; Ul ng-controller = "myCtrl" & gt; & Lt; Li ng-repeat = "menus names in all names" ng-mouseceter = "show = true" ng-mouselev = "show = fotl" & gt; & Lt; One class = "list-group-menu" href = "#" & gt; & Lt; Div class = "icon-user" & gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; Div ng-show = "show" & gt; {{MenuName}} & lt; / Div & gt; & Lt; / Li & gt; & Lt; / Ul & gt;