I implemented a data model where the first ticker is initially set to selected by default.
Now, when a user clicks on another item, I want to efficiently deselect all other tickers and set the selected value to true for the clicked item:
<li class="ticker-li"
ng-repeat="ticker in tickers"
ng-hide="ticker.removed"
ng-class="{'selected':ticker.selected}"
ng-mouseleave="hideTickerOptions()">
<div class="ticker"
ng-click="unselectAll(); ticker.selected = !ticker.selected;
selectTicker(ticker);">
{{ticker.ticker}}
</div>
</li>
I attempted using a forEach function, but encountered an error stating that [object Array] is not a function:
var vs = $scope;
vs.unselectAll = function() {
vs.tickers.forEach(vs.tickers, function(ticker) {
ticker.selected = false;
});
};
Although a regular for-loop solution can work, I am questioning its efficiency in toggling all the selected values to false:
for (var i = 0; i < vs.tickers.length; i++) {
vs.tickers[i].selected = false;
}
My approach involves running the unselectAll function to clear selections before proceeding with selecting the current item in the markup:
<div class="ticker"
ng-click="unselectAll(); ticker.selected = !ticker.selected;
selectTicker(ticker);">
{{ticker.ticker}}
</div>