Zoznam dynamického zaškrtávacieho políčka v jazyku Angular a JSON API - json, angularjs

Mám problémy s vykreslením dynamických začiarkavacích políčok s odpoveďou JSON API.

Tento 2 ng-opakuje:

1. Uvedenie zoznamu kategórií v BD a;
2. ng-model s vybraným zoznamom kategórií.

Pod mojím HTML kódom;

<ul class="list-group">
<li class="list-group-item" ng-repeat="cats in categorias">
<div class="checkbox"><label><input type="checkbox" ng-model="checkbox[item.cats]"><span class="checkbox-material"><span class="check"></span></span></label> {{cats.name}}</div>
</li>
</ul>

Odpoveď JSON / API (1)

[
{"id":"1","id_module":"1","name":"Esportes"},
{"id":"2","id_module":"1","name":"Entretenimento"},
{"id":"3","id_module":"1","name":"Terror"},
{"id":"4","id_module":"1","name":"Drama"}
]

Odpoveď JSON (2)

{cats":["1","2"]}

Bol by som rád, keby bolo políčko začiarknuté spolu s odpoveďou.

Má niekto nejaký nápad?

odpovede:

Tu máte pracovnú úlohu, skontrolujte ju

jsfiddle.net/b895j3ay

var app = angular.module("Application", [])
app.controller("Ctrl", function($scope) {
$scope.roles = [{
id: 1,
text: "guest"
}, {
id: 2,
text: "user"
}, {
id: 3,
text: "customer"
}, {
id: 4,
text: "admin"
}];
$scope.isChecked = function(id, matches) {
var isChecked = false;
angular.forEach(matches, function(match) {
if (match === id) {
isChecked = true;
}
});
return isChecked;
}
$scope.user = {
roles: [2, 4, 3]
};
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<div ng-app="Application">
<div ng-controller="Ctrl">
<label ng-repeat="role in roles">
<input type="checkbox" ng-model="user.roles" checklist-value="role.id" ng-checked="isChecked(role.id,user.roles)">{{role.text}}
</label>
</div>
</div>
</div>