angularjs - Changing value of a boolean using ng-click used inside a ng-repeat -
i displaying data on html page inside div using ng-repeat. inside div
have button in order hide content of each div
seperately.here simplified version of html file.
<body ng-app="task" ng-controller="repeat"> <div ng-repeat='x in array' ng-show="{{ x.show }}"> <p>{{ x.text }} </p> <button ng-click="toggle()">hide</button> </div> </body>
the code in .js file follows
var app = angular.module('task'); app.controller('repeat',function($scope){ $scope.array = [{ show: true, text:'sample text 1'}, { show: true, text:'sample text 2'}, { show: true, text:'sample text 3'}]; $scope.toggle = function(){ $scope.array.show = false ; }; })
can suggest me required changes on clicking button inside div
, particular div gets hidden.
i think committing mistake in referencing particular element of array while calling function toggle()
through ng-click
put element argument in toggle function.
<button ng-click="toggle(x)">hide</button>
and change in controller this:
$scope.toggle = function(x){ x.show = !x.show; };
Comments
Post a Comment