How to pass data to other scopes variables in angularjs?

Question

I have controller

<div ng-controller="LeftSideNavWorkController as vm"  ">
  <div ng-repeat="item in vm.items track by $index">
    <div ng-click="vm.hideAllElements()>Hide</div>
    <div ng-show = "showChildren[$index]" >Show/Hide element<div>
  </div>
</div>

in controller:

vm.hideAllElements = hideAllElements;
vm.items = [... ... ...]; //some array of items

function hideAllElements() {
//how set all showChildren[] variables to false?
 }

the task is that when I click on one it should set all vm.show = false

Close all repeated elements - not clear with this? What exactly is the desired result? Can you please elaborate? — Nikhil Aggarwal
– Nikhil Aggarwal, Commented Sep 14, 2016 at 10:53
edited. The final task is to close all opened elements when I click on any of <div>Hide</div> — Serhiy
– Serhiy, Commented Sep 14, 2016 at 10:57
You need to elaborate what is close and open with an example, otherwise, it is difficult to judge the desired functionality you are trying to achieve — Nikhil Aggarwal
– Nikhil Aggarwal, Commented Sep 14, 2016 at 11:05

Michal Kucaj · Accepted Answer · 2016-09-14 11:07:24Z

1

TRY THIS ONE: HTML:

   <div ng-controller="LeftSideNavWorkController as vm"  ">
    <div ng-repeat="item in vm.items track by $index">
      <div ng-click="vm.hideAllElements()>Hide</div>
      <div ng-show = "showChildren[$index]" >Show/Hide element<div>
    </div>
   </div>

CTRL:

(function() {
    'use strict'
    angular
        .module('myApp')
        .controller('appController', appController);
    // main.js
    function appController($scope, $interval) {
        var vm = this;
        vm.items = [1, 2, 3, 4, 5];
        vm.hideAllElements = hideAllElements;
        vm.show = true;


        function hideAllElements() {
            vm.items.forEach(function(obj, i) {
                vm.show = false;
            });
        }
    }
}());

edited Sep 14, 2016 at 11:07

answered Sep 14, 2016 at 11:00

Michal Kucaj

6916 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Serhiy Over a year ago

where did you take app?

jaguwalapratik · Accepted Answer · 2016-09-14 11:05:38Z

0

You just have to do

In your view

 <div ng-controller="LeftSideNavWorkController as vm"  ">
    <div ng-repeat="item in vm.items track by $index">
         <div ng-click="vm.hideAllElements()>Hide</div>
         <div ng-show = "item.show" >Show/Hide element<div>
    </div>
 </div>

In controller function:

function hideAllElements() {
    vm.items.forEach(function(item) {
       item.show = false;
    }
}

edited Sep 14, 2016 at 11:05

answered Sep 14, 2016 at 10:59

jaguwalapratik

4063 silver badges10 bronze badges

2 Comments

Serhiy Over a year ago

I've edited question. will not use vm.show any more .

jaguwalapratik Over a year ago

@Serhiy as the controller level variable is shared inside view, you have to define property in each item to handle show/hide of item.

Collectives™ on Stack Overflow

How to pass data to other scopes variables in angularjs?

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related