我有一个数组
$scope.headArray=[
'Online & Open Alarms',
'Sites Overview',
'Active Alarms',
'Hidden Alarms'
];
我有一个对象:
$scope.dashboardstatus = {
hideDashboard1:true, closeDashboard1:false,
hideDashboard2:true, closeDashboard2:true,
hideDashboard3:false, closeDashboard3:false,
hideDashboard4:false, closeDashboard4:false
}
我想创建这个表:
$scope.dashArray = [
{Online & Open Alarms:{hideDashboard1:true,closeDashboard1:false}} ,
{Sites Overview: {hideDashboard2:true,closeDashboard2:true}},
Actives Alarms: {hideDashboard3:false,hideDashboard3:false},
{Hidden Alarms: {hideDashboard4:false,closeDashboard4}}
]
我试过了:
for (var i=0; i< $scope.headingArray.length; i++){
$scope.dashArray.push({$scope.headingArray[i],
{$scope.dashboardstatus['closeDashboard'(i+1)],$scope.dashboardstatus['hideDashboard'+(i+1)]}}
);
}
但没有工作!
如何将数据推送到dashArray?
答案 0 :(得分:4)
您可以执行以下操作以获得最终结果:
let headArray=['Online & Open Alarms','Sites Overview','Active Alarms','Hidden Alarms'];
let dashboardstatus = {hideDashboard1:true,closeDashboard1:false,hideDashboard2:true,closeDashboard2:true,hideDashboard3:false,closeDashboard3:false,hideDashboard4:false,closeDashboard4:false}
let result = headArray.map((element, index) => {
let hideKey = `hideDashboard${index+1}`;
let closeKey = `closeDashboard${index+1}`;
return {[element]: {
[hideKey]:dashboardstatus[hideKey],
[closeKey]:dashboardstatus[closeKey]
}}
})
console.log(result);
答案 1 :(得分:3)
解决方案如下: -
$scope.headArray = ['Online & Open Alarms', 'Sites Overview', 'Active Alarms', 'Hidden Alarms'];
$scope.dashboardstatus = {
hideDashboard1: true,
closeDashboard1: false,
hideDashboard2: true,
closeDashboard2: true,
hideDashboard3: false,
closeDashboard3: false,
hideDashboard4: false,
closeDashboard4: false
}
$scope.dashArray = [];
for (var i = 0; i < $scope.headArray.length; i++) {
//form the child object first
var objFirstChild = "hideDashboard" + (i + 1);
var objSecondChild = "closeDashboard" + (i + 1);
var childObj = {};
childObj["hideDashboard" + (i + 1)] = $scope.dashboardstatus[objFirstChild];
childObj["closeDashboard" + (i + 1)] = $scope.dashboardstatus[objSecondChild];
//form the parent object and push it into array
var parentObj = {}
parentObj[$scope.headArray[i]] = childObj;
$scope.dashArray.push(parentObj);
}
console.log($scope.dashArray);
简单JavaScript中的简化方式,如下: -
var headArray = ['Online & Open Alarms', 'Sites Overview', 'Active Alarms', 'Hidden Alarms'];
var dashboardstatus = {
hideDashboard1: true,
closeDashboard1: false,
hideDashboard2: true,
closeDashboard2: true,
hideDashboard3: false,
closeDashboard3: false,
hideDashboard4: false,
closeDashboard4: false
}
var dashArray = [];
for (var i = 0; i < headArray.length; i++) {
var objFirstChild = "hideDashboard" + (i + 1);
var objSecondChild = "closeDashboard" + (i + 1);
var childObj = {};
childObj["hideDashboard" + (i + 1)] = dashboardstatus[objFirstChild];
childObj["closeDashboard" + (i + 1)] = dashboardstatus[objSecondChild];
var parentObj = {}
parentObj[headArray[i]] = childObj;
dashArray.push(parentObj);
}
console.log(dashArray);
答案 2 :(得分:2)
你根本不远,你要找的是计算属性(或者只是在创建对象后设置属性名称)。您可以使用属性初始值设定项中[expression]
左侧的:
来执行计算属性名称。
我会使用map
:
const headArray=['Online & Open Alarms','Sites Overview','Active Alarms','Hidden Alarms'];
const dashboardstatus = {hideDashboard1:true,closeDashboard1:false,hideDashboard2:true,closeDashboard2:true,hideDashboard3:false,closeDashboard3:false,hideDashboard4:false,closeDashboard4:false}
const dashArray = headArray.map((name, index) => {
const hide = "hideDashboard" + (index + 1);
const close = "closeDashboard" + (index + 1);
return {
[name]: {[hide]: dashboardstatus[hide], [close]: dashboardstatus[close]}
};
});
console.log(dashArray);
.as-console-wrapper {
max-height: 100% !important;
}
请注意,自ES2015起,计算属性名称为new(ish)。在ES2015之前,您必须先创建对象,然后添加属性。 map
回调的主体是:
const hide = "hideDashboard" + (index + 1);
const close = "closeDashboard" + (index + 1);
const obj = {};
const value = {};
value[close] = dashboardstatus[close];
value[hide] = dashboardstatus[hide];
obj[name] = value;
return obj;
但是如果你不想使用map
,这里的版本对你现有代码的改动很小:
const headArray=['Online & Open Alarms','Sites Overview','Active Alarms','Hidden Alarms'];
const dashboardstatus = {hideDashboard1:true,closeDashboard1:false,hideDashboard2:true,closeDashboard2:true,hideDashboard3:false,closeDashboard3:false,hideDashboard4:false,closeDashboard4:false}
const dashArray = [];
// Note that you had $scope.headingArray, not $scope.headArray, but you showed
// $scope.headArray when showing the array's contents
for (var i = 0; i < headArray.length; i++) {
const close = 'closeDashboard' + (i + 1); // <== Note the + before (i + 1) to do string
const hide = 'hideDashboard' + (i + 1); // concatenation, was missing from one of yours
dashArray.push({
[headArray[i]]: // <== computed property name, note : not , after it
{
[close]: dashboardstatus[close], // <== Another computed property name
[hide]: dashboardstatus[hide] // <== And another
}
});
}
console.log(dashArray);
.as-console-wrapper {
max-height: 100% !important;
}
再次,在ES2015之前,您必须先创建对象,然后添加属性。 for
循环的主体将是:
const close = 'closeDashboard' + (i + 1);
const hide = 'hideDashboard' + (i + 1);
const obj = {};
const value = {};
value[close] = dashboardstatus[close];
value[hide] = dashboardstatus[hide];
obj[headArray[i]] = value;
dashArray.push(obj);
那就是说,你可能想重温一下你的结构。显然,如果不了解更多(这将超出原始问题的范围)是不可能确定的,但这种结构看起来可能比它可能更复杂。