Currently I have a HTML page that contains nested ng-repeat and I have a variable called "isExpand" in the inner ng-repeat. I am wondering is there any ways to modify "isExpand" from the controller?
The following is a demo HTML layout:
<div ng-repeat="(key, value) in menus">
<div> {{key}} </div>
<div ng-repeat="item in value">
<div >
<img class="title-col-img" ng-show="!isExpand" src="img/Close.png" ng-click="isExpand = true">
<img class="title-col-img" ng-show="isExpand" src="img/Open.png" ng-click="checkContentChanged(item)">
<div class="title-col-text" > {{item.name || 'empty'}} </div>
</div>
<div ng-click="isExpand = true">
C<textarea ng-show="isExpand" ng-model="item.field1"> </textarea>
</div>
<div class="description-col col-md-4" ng-click="isExpand = true">
<textarea ng-show="isExpand" ng-model="item.field2"> </textarea>
</div>
</div>
</div>
Sure: make it a field of the current element of the array you're iterating on:
<div ng-repeat="item in value">
<div>
<img class="title-col-img" ng-show="!item.isExpanded" src="img/Close.png" ng-click="item.isExpanded = true">
</div>
...
</div>