Automatically set checkbox to true based on an integer - angularjs

Question

Hi I need to convert or use the sent integer value from the checkboxes at the reserve page to the view/print transaction page.
Please see my old question:
How to add IDs of a checkbox in angular js
I am able to get the values from the database and display it on the view page the only problem is that the checkboxes are null. There are 5 checkboxes on the reservation page (Laptop, Headset, Projector, Tablet, Speakers) so the possible combinations are 32 that's why i used to send an integer from 0 - 31 to the database because there's only one column for the reserved items.
I have successfully manage (with the help of this community) to post and get values from the database.
Now please help me to convert/use that INT value to automatically set the checkbox value to true if it was checked by the user on the reserve page.
Example:
Laptop = 1; Headset = 2; Projector = 4; Tablet = 8; Speakers = 16
The user checks (reserve page)
✓ Laptop, Headset, ✓ Projector, Tablet, ✓ Speakers
The value on the DB: 21
One the view/print page
I need to use the int value on the DB (which is 21) to automatically check the checkbox ✓ Laptop, Headset, ✓ Projector, Tablet, ✓ Speakers in read-only disabled mode .
So far this is my code in html and controller:
function getReservedRequestsById(reservedRequestId) {
var key = reservedRequestId;
return dataservice.getReservedRequests(key).then(function (data) {
vm.ReservedRequestId = data.data;
console.log(vm.ReservedRequestId);
logger.info('ACTIVATED');
//CheckBox
if (vm.ReservedRequestId.Items > 15) {
$scope.chkItems.forEach(function (Item) {
if (Item.id == 16) {
Item.value = true;
}
})
}
else if ((16 > vm.ReservedRequestId.Items > 7) || (32 > vm.ReservedRequestId.Items > 23)) {
$scope.chkItems.forEach(function (Item) {
if (Item.id == 8) {
Item.value = true;
}
})
}
else if ((8 > vm.ReservedRequestId.Items > 3) || (16 > vm.ReservedRequestId.Items > 11) || (24 > vm.ReservedRequestId.Items > 19) || (32 > vm.ReservedRequestId.Items > 27)) {
$scope.chkItems.forEach(function (Item) {
if (Item.id == 4) {
Item.value = true;
}
})
}
// AND also for 1 & 2 i did not put it here because i would like to just test if it is working on the three check boxes. If it is working i'll just add the other two
}
<md-input-container class="md-block" flex-gt-sm>
<label class="force-input-label">Items</label>
</br>
<div ng-repeat="chkItem in chkItems">
<md-checkbox name="chkItem.name" ng-model="chkItem.value" readonly>{{chkItem.name}}
</div>
</md-input-container>
it is not currently working
Need help and advice
Not good in english as well as in angularjs/web development : )
your help is greatly appreciated!

Answer 1

I fixed your code. I only kept the logic you provided. The problem was that 16 > x > 7 is not a correct syntax in javascript. You have to use &&.
//Laptop = 1; Headset = 2; Projector = 4; Tablet = 8; Speakers = 16
var chkItems = [{
id: 1,
name: 'Laptop',
value: null,
}, {
id: 2,
name: 'Headset',
value: null
}, {
id: 4,
name: 'Projector',
value: null
}, {
id: 8,
name: 'Tablet',
value: null
}, {
id: 16,
name: 'Speakers',
value: null
}];
var items = 21;
if (items >= 16) {
selectItem(16);
}
if ((items < 16 && items > 7) || (items < 32 && items > 23)) {
selectItem(8);
}
if ((items < 8 && items > 3) || (items < 16 && items > 11) || (items < 24 && items > 19) || (items < 32 && items > 27)) {
selectItem(4);
}
console.log(chkItems);
function selectItem(id) {
chkItems.map(function(elem) {
if (!elem.value)
elem.value = (elem.id === id);
return elem;
});
}