JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-controller='MyCtrl'>
Show additional options <input type="checkbox" ng-model="additionalOptions">
<div ng-show="additionalOptions">
<ul>
<li ng-repeat="option in availableOptions">
<label class="checkbox" for="opt_{{option.id}}">
<input type="checkbox" name="opt_{{option.id}}" id="opt_{{option.}}" ng-model="option.checked"/>
{{option.name}}
<ul ng-show="option.checked">
<li>
<div ng-repeat="i in getItterator(option.count)">
<input type="text" ng-model="option.values[$index]"/>
{{option.values[$index]}}
</div>
</li>
</ul>
</label>
</li>
</ul>
</div>
</div>
JavaScript
function MyCtrl($scope) {
$scope.availableOptions = [{"id":"1","name":"easy","count":"2",values:[]},{"id":"2","name":"medium","count":"3",values:[]},{"id":"3","name":"hard","count":"2",values:[]}];
$scope.getItterator=function(n){
var a = new Array();
for(var i=1; i <= n; i++)
a.push(i);
return a;
};
}