Hello, I am just starting out with angularjs and need some guidance. I have a json data set called selectedRoomList, and I want to generate text based on this data. To display the information in a spinner, I am using nested ng-repeat loops. The challenge is that when the value changes, I need to present the selected room list in text form. For example, if I select two single rooms and one double room, it should be displayed as 2SGL,1DBL. This task is proving to be quite tricky for me, so I would greatly appreciate any help or solutions offered.
"roomTypes" : [{
"type" : "Deluxe",
"Deluxe" : [{
"id" : "",
"name": "Deluxe",
"roomCategory" : "Single",
"maxOccupancy" : 2,
"childAllowed" : true,
"number" : 0
},
{
"id" : "",
"name": "Deluxe",
"roomCategory" : "Double",
"maxOccupancy" : 3,
"childAllowed" : true,
"number" : 0
},
...
In my HTML code below, I use ng-repeat to display different room types:
header :Deluxe:
label : Single spinner : value :number
<div ng-repeat="room in roomTypes">
<h5 style="color:#ff7043;">{{::$eval('messages.webapp.itinerary.hotel.roomType.'+room.type.toUpperCase())}}</h5>
<div class="form-group col-md-3 col-xs-4" ng-repeat="roomCat in room[room.type]">
<label class="col-md-12 col-xs-12">{{::$eval('messages.webapp.itinerary.hotel.changeRoom.'+roomCat.roomCategory.toUpperCase())}}</label>
<div touch-spin ng-model="roomCat.number"></div>
</div>
</div>
To create the required text output like 2SGL,1DBL, I've implemented the following function:
$scope.getMultipleRoomList = function(multiple){
var multipleRoom=multiple;
var numSignle;
var room='';
console.log('Hello Welcome To',numSignle);
multipleRoom.forEach(function(item,idx){
var roomType=item;
roomType[item.type].forEach(function(item1,idx1){
if(item1.number!=0){
console.log(numSingle);
if(item1.roomCategory.toUpperCase()=='SINGLE'){
room=room+item1.number+'SGL,';
}
else if(item1.roomCategory.toUpperCase()=='DOUBLE'){
room=room+item1.number+'DBL,';
}
else if(item1.roomCategory.toUpperCase()=='TRIPLE'){
room=room+item1.number+'TRPL,';
}
else if(item1.roomCategory.toUpperCase()=='TWIN'){
room=room+item1.number+'TWN,';
}
}
});
});
room = room.replace(/(^,)|(,$)/g, "");
return room;
};
Whenever there is a change in the spinner reference, the above function is triggered. However, using the variable numSingle inside forEach causes an error.