I m doing a angular stuff for my work. I have set of element with ng-show and im passing "custom" on each element ng-show. But its not working for me. im new to angular. Can anyone help me to fix this issue
My need is Every element has UL with hided state. when i click one element its show corresponding ul and all other element's ul has hided. If i click another one element, previous opened one ul should closed and clicked element's ul should opened.
My Code is below
app.controller('multiSelect',['$scope', function($scope){
$scope.custom = false;
$scope.toggleCustom = function(event) {
$scope.custom = false;
$(event.target).custom = true;
console.log($scope.custom);
console.log($(event.target).custom);
};
}]);
My Html is
<table cellspacing="0" cellpadding="0" border="0" class="">
<tbody>
<tr>
<td ng-controller="multiSelect" ng-click="toggleCustom($event)" ng-class="{active : isSelected(site)}">
<div class="upvalue">1</div><div class="downvalue">{{selected}}</div>
<ul class="reveal" ng-show="custom">
<li class="pointer"></li>
<li ng-repeat="site in sites" ><a href="javascript:void(0)" ng-click="setMaster(site)">{{site.name}}</a></li>
</ul>
</td>
<td></td>
<td ng-controller="multiSelect" ng-click="toggleCustom($event)" ng-class="{active : isSelected(site)}">
<div class="upvalue">2</div><div class="downvalue">{{selected}}</div>
<ul class="reveal" ng-show="custom">
<li class="pointer"></li>
<li ng-repeat="site in sites" ><a href="javascript:void(0)" ng-click="setMaster(site)">{{site.name}}</a></li>
</ul>
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td ng-controller="multiSelect" ng-click="toggleCustom($event)" ng-class="{active : isSelected(site)}">
<div class="upvalue">3</div><div class="downvalue">{{selected}}</div>
<ul class="reveal" ng-show="custom">
<li class="pointer"></li>
<li ng-repeat="site in sites" ><a href="javascript:void(0)" ng-click="setMaster(site)">{{site.name}}</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
You will need to add $event when calling this function. For Example
<a href="#" ng-click="toggleCustom($event)" > Toggle </a>
Set controller and event in html code
<div ng-controller = "multiSelect">
<button ng-click = "toggleCustom(evt)" >Button</button>
</div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.