How can we get the child scope value in function and toggle it (Angular Js)?

Question!

Can we change the dom level child scope value using javascript function?

 <article data-ng-init="show=true" data-ng-repeat="a in obj track by $index">
    <div class="holder">
      <div class="submit_btn" data-ng-bind="a.name" data-ng-click="ajaxCall(a,$event,show);"></div>
    </div>
    <ahref ="javascript:void(0)" data-ng-click="show=true></a>
    </article>
####Controller
$scope.ajaxCall = function (obj,event,show){

//after ajax success togggle show

show = !show; //nothing is happening
};


Answers
Right now show property shared by all article.So, whatever you do changes in it, will affect to all.

You can define html as follows.

Assign show property to each a object.

So,it will affect only respected article.

<article data-ng-init="a.show=true" data-ng-repeat="a in obj track by $index">
    <div class="holder">
        <div class="submit_btn" data-ng-bind="a.name" data-ng-click="ajaxCall(a,$event,a.show);"></div>
    </div>
    <ahref="javascript:void(0)" data-ng-click="sa.how=true">
        </a>
</article>

And call ajaxCall method with a.show



I think you did just forgot a $scope...:

$scope.ajaxCall = function(obj, event, show) {
  // on ajax call success, toggle $scope.show
  $scope.show = !show; // something should happen... :-)
};
By : MarcoS


This could help

$scope.show = [];
$scope.ajaxCall = function(obj, event, index) {
  // after ajax success toggles show
  $scope.show[index] = !$scope.show[index];
};




<div class="submit_btn" data-ng-bind="a.name"
     data-ng-click="ajaxCall(a,$event,$index);"></div>


This video can help you solving your question :)
By: admin