I'm trying to select data and bind it to a specific item, however once I select the data, all of my items are now bound to the selected data. How can I select specific data to each of my items.
here is my demo. http://play.ionic.io/app/cb25b106e671
You need a mapping data structure to save selection for each day. There can be better way but quite simply it can be like this
$scope.data = {
"Monday": {workout: ''},
"Tuesday": {workout: ''},
"Wednesday": {workout: ''},
"Thursday": {workout: ''},
"Friday": {workout: ''},
"Saturday": {workout: ''},
"Sunday": {workout: ''}
}
and you also need to track the current day selected so you can map the selected workout to that currentDay
key.
So first, set curretDay when you open workout selector by doing this
<a class="item" ng-repeat="day in days" ng-click="openModal(day.day)">{{data[day.day].workout}}
<span class="item-note">{{day.day}}</span>
</a>
and
$scope.openModal = function(day) {
$scope.currentDay = day;
$scope.modal.show();
};
Second, when a workout is selected you need to set it on the currentDay
key
<ion-radio class="item" ng-repeat="item in workouts" ng-value="item.workout" ng-model="data[currentDay].workout">{{item.workout}}</ion-radio>
Here is the complete working demo (based on your demo of course)