Reactive form in angular with grouped check box panel

please see the json below

[
{
"label": "General",
"data": [
{
"title": "parameters.deviceInfo.name"
},
{
"title": "assetAttributes.manufacturerLabel"
}

]
},
{
"label": "Associated Device",
"data": [
{
"title": "assetAttributes.operationsLabel",

},
{
"title": "assetAttributes.adapterIpAddress",

}
]
},
{
"label": "profile.identificationTabLabel",
"data": [
{
"title": "assetAttributes.assetIdLabel"

}
]
},
{
"label": "profile.communicationTabLabel",
"data": [
{
"title": "profile.networkGroupLabel",
},
{
"title": "assetAttributes.gtwAddressLabel",
}
]
},
{
"label": "profile.locationTabLabel",
"data": [
{
"title": "assetAttributes.latitudeLabel"

},
{
"title": "assetAttributes.longitudeLabel"

}

]
},
{
"label": "profile.customersTabLabel",
"data": [
{
"title": "assetAttributes.mRidLabel"

},
{
"title": "assetAttributes.epsNameLabel"
}
]
}
]


want to create reactive form in angular with grouped check box panel with select all for each object. That means when user clicks general checkbox, all the items inside that panel should be checked. Also one select all for selecting all the panel elements in one click.

Continue reading...