এই উদাহরণ ব্যবহার করে@ উমুর কনটাসের আমি অন্য সম্পাদন পৃষ্ঠার মতো অন্য কোনও অবজেক্ট / অ্যারে জুড়ে নির্বাচিত ডেটা ধরতে ব্যবহার করার কথা মনে করি।
ডাটাবেসে ক্যাচ অপশন
কিছু বিকল্প টগল করুন
উদাহরণস্বরূপ, নীচে সমস্ত রঙের জসন:
{
"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"}
এবং এখানে, আমার জাভাস্ক্রিপ্ট কোড:
/**
* 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;
};
আমার এইচটিএমএল কোড:
<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 "আপেল": সত্য, "কমলা": মিথ্যা, "নাশপাতি": সত্য, "নর্তজি": সত্য}