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

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

php - Best Light server (Linux + Web server + Database) for Raspberry Pi -

c# - "Newtonsoft.Json.JsonSerializationException unable to find constructor to use for types" error when deserializing class -