Використовуючи цей приклад @Umur Kontacı, я думаю, що використовую для лову вибраних даних у іншому об’єкті / масиві, як-от на сторінці редагування.
Параметри лову в базі даних
Увімкніть деякий варіант
Наприклад, всі кольори json нижче:
{
"colors": [
{
"id": 1,
"title": "Preto - #000000"
},
{
"id": 2,
"title": "Azul - #005AB1"
},
{
"id": 3,
"title": "Azul Marinho - #001A66"
},
{
"id": 4,
"title": "Amarelo - #FFF100"
},
{
"id": 5,
"title": "Vermelho - #E92717"
},
{
"id": 6,
"title": "Verde - #008D2F"
},
{
"id": 7,
"title": "Cinza - #8A8A8A"
},
{
"id": 8,
"title": "Prata - #C8C9CF"
},
{
"id": 9,
"title": "Rosa - #EF586B"
},
{
"id": 10,
"title": "Nude - #E4CAA6"
},
{
"id": 11,
"title": "Laranja - #F68700"
},
{
"id": 12,
"title": "Branco - #FFFFFF"
},
{
"id": 13,
"title": "Marrom - #764715"
},
{
"id": 14,
"title": "Dourado - #D9A300"
},
{
"id": 15,
"title": "Bordo - #57001B"
},
{
"id": 16,
"title": "Roxo - #3A0858"
},
{
"id": 18,
"title": "Estampado "
},
{
"id": 17,
"title": "Bege - #E5CC9D"
}
]
}
І два типи об'єктів даних, array
з одним об'єктом і object
містять два / більше даних об'єкта:
У базі даних знайдено два обрані елементи:
[{"id":12,"title":"Branco - #FFFFFF"},{"id":16,"title":"Roxo - #3A0858"}]
Один обраний елемент потрапив у базу даних:
{"id":12,"title":"Branco - #FFFFFF"}
І ось, мій код JavaScript:
/**
* Add this code after catch data of database.
*/
vm.checkedColors = [];
var _colorObj = vm.formData.color_ids;
var _color_ids = [];
if (angular.isObject(_colorObj)) {
// vm.checkedColors.push(_colorObj);
_color_ids.push(_colorObj);
} else if (angular.isArray(_colorObj)) {
angular.forEach(_colorObj, function (value, key) {
// vm.checkedColors.push(key + ':' + value);
_color_ids.push(key + ':' + value);
});
}
angular.forEach(vm.productColors, function (object) {
angular.forEach(_color_ids, function (color) {
if (color.id === object.id) {
vm.checkedColors.push(object);
}
});
});
/**
* Add this code in your js function initialized in this HTML page
*/
vm.toggleColor = function (color) {
console.log('toggleColor is: ', color);
if (vm.checkedColors.indexOf(color) === -1) {
vm.checkedColors.push(color);
} else {
vm.checkedColors.splice(vm.checkedColors.indexOf(color), 1);
}
vm.formData.color_ids = vm.checkedColors;
};
Мій код Html:
<div class="checkbox" ng-repeat="color in productColors">
<label>
<input type="checkbox"
ng-checked="checkedColors.indexOf(color) != -1"
ng-click="toggleColor(color)"/>
<% color.title %>
</label>
</div>
<p>checkedColors Output:</p>
<pre><% checkedColors %></pre>
[Редагувати] Відредагований код нижче:
function makeCheckedOptions(objectOptions, optionObj) {
var checkedOptions = [];
var savedOptions = [];
if (angular.isObject(optionObj)) {
savedOptions.push(optionObj);
} else if (angular.isArray(optionObj)) {
angular.forEach(optionObj, function (value, key) {
savedOptions.push(key + ':' + value);
});
}
angular.forEach(objectOptions, function (object) {
angular.forEach(savedOptions, function (color) {
if (color.id === object.id) {
checkedOptions.push(object);
}
});
});
return checkedOptions;
}
І зателефонуйте до нового методу, як показано нижче:
vm.checkedColors = makeCheckedOptions(productColors, vm.formData.color_ids);
Це воно!
<input type='checkbox' ng-model="checkboxes.apple">
і т. Д. Модель буде: {"apple": true, "orange": false, "pear": true, "naartjie": true}