Tree View with Angular JS and Kendo UI - javascript

In my angular web I am using Kendo UI for representing tree view. Here is my html file.
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.226/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.226/styles/kendo.material.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.1.226/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.1.226/js/kendo.all.min.js"> </script>
</head>
<body>
<div ng-app="myapp">
<div ng-controller="myappCtrl">
<div ng-attr-id="{{ treeview }}" kendo-tree-view k-options="treeview"></div>
</div>
<div style="padding-top: 2em;">
<h4>Selected:</h4>
<p ng-attr-id="{{ selected }}">No interests selected.</p>
</div>
</div>
<script src="../scripts/test.js"></script>
</body>
</html>
And this is my test.js
var app = angular.module('myapp', []);
app.controller('myappCtrl', function($scope, $http, $window) {
$scope.dataModal = [ {
"key" : "Key",
"type" : "type",
"value" : 1,
"items" : [ {
"key" : "Key",
"type" : "type1",
"items" : [ {
"key" : "Key",
"type" : "type1",
"items" : [ {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [ {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [ {
"key" : "Key",
"type" : "type1",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
}, {
"key" : "Key",
"type" : "type1",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"value" : 1,
"items" : [ {
"key" : "subUser1",
"type" : "role11",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"value" : 1,
"items" : [ {
"key" : "subUser1",
"type" : "role11",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"value" : 1,
"items" : [ {
"key" : "subUser1",
"type" : "role11",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"value" : 1,
"items" : [ {
"key" : "subUser1",
"type" : "role11",
"items" : [
]
} ]
}, {
"key" : "Key",
"type" : "type1",
"value" : 1,
"items" : [ {
"key" : "subUser1",
"type" : "role11",
"items" : [
]
} ]
} ];
$scope.treeview = {
checkboxes : {
checkChildren : true
},
//check : onCheck,
dataTextField : "key",
loadOnDemand : false,
dataSource : $scope.dataModal
};
// get keys of checked nodes
function checkedNodeIds(nodes, checkedNodes) {
for (var i = 0; i < nodes.length; i++) {
if (nodes[i].checked) {
checkedNodes.push(nodes[i].key);
}
if (nodes[i].hasChildren) {
checkedNodeIds(nodes[i].children.view(), checkedNodes);
}
}
}
// show checked nodes on data source change
function onCheck() {
var checkedNodes = [];
var treeView = $("#treeview").data("kendoTreeView");
var message = "";
checkedNodeIds(treeView.dataSource.view(), checkedNodes);
if (checkedNodes.length > 0) {
message = "Selected Interests: " + checkedNodes.join(", ");
} else {
message = "No Interests Checked.";
}
$("#selected").html(message);
}
});
My page is displaying the tree view. And I am using two functions to get the selected items of the tree. But it gives as error on console log as below.
test.js:347 Uncaught TypeError: Cannot read property 'dataSource' of null
Line 347: checkedNodeIds(treeView.dataSource.view(), checkedNodes);
Please be kind enough to show me what's wrong with my codes.
Thank You


First of all your code needs some modifications
In order to use kendo directives inside angular you need to introduce a dependency on them, this is done on your module configuration, without this configuration anything will work
var app = angular.module('myapp', ['kendo.directives']);
You should avoid using jQuery selectors on controllers, it's place is in angualr directives. In order to set the output message to the view you can simply use a variable on your scope and then bind it on the view
// show checked nodes on data source change
function onCheck(kendoEvent) {
var checkedNodes = [];
var treeView = kendoEvent.sender;
var message = "";
checkedNodeIds(treeView.dataSource.view(), checkedNodes);
if (checkedNodes.length > 0) {
message = "Selected Interests: " + checkedNodes.join(", ");
} else {
message = "No Interests Checked.";
}
$scope.$apply(function() { $scope.selectedItems = message; });
}
Note that we use $scope.$apply, to set this message, this is because jQuery events which is used by kendo happens outside the control of angular, so angular does not update the view because he doesn't know that he has to do it, using $scope.$apply we force it Angular to update the bindings.
onCheck event inside tree configuration should be uncomment, all kendo events handlers receives a parameter as an argument, which contains a pointer to the widget. documentation

Related

Need to remove duplication in array of objects and merge array with union USING JS

Need to remove duplication in array of objects and merge array with union USING JS.
trying to filter array
Just wanted to merge array["INTERFACE"] on the basis of APP_ID. and remove duplicate records.
unfiltered unmerged array!
var data = [
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC",
"URL" : "/SummaryCopc",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "05",
"NAME" : "SUMMARY",
"URL" : "/Summary",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC 2",
"URL" : "/SummaryCopc2",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD 2",
"URL" : "/Dashboard 2",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
}
];
wanted result
[
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "05",
"NAME" : "SUMMARY",
"URL" : "/Summary",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC",
"URL" : "/SummaryCopc",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
}, {
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD 2",
"URL" : "/Dashboard2",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC 2",
"URL" : "/SummaryCopc2",
"STATUS" : "A"
}
]
}
]
trying to filter array
Just wanted to merge array["INTERFACE"] on the basis of APP_ID. and remove duplicate records.

Here is a slightly elastic solution relying on function generators that allows dynamic aggregation.
The logic followed by the below example is that in your data input, the unique key of the main objects is APP_ID. Next, the aggregation rule of each APP_ID is that it should follow another aggregation rule for INTERFACE. Each interface, in fact, has a unique NAME, explaining why you have multiple "07" and "06" in your result sample.
The code explanation is documented in the code itself.
var data = [
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC",
"URL" : "/SummaryCopc",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "05",
"NAME" : "SUMMARY",
"URL" : "/Summary",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC 2",
"URL" : "/SummaryCopc2",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD 2",
"URL" : "/Dashboard 2",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
}
];
// Aggregate duplicates with a common uniqueKey, invoking the aggregateExpression callback for each pair.
function* aggregateDuplicates(arr, uniqueKey, aggregateExpression) {
const aggregateGroups = arr.reduce((acc,next) => {
acc[next[uniqueKey]] = acc[next[uniqueKey]] || [];
return acc[next[uniqueKey]].push(next), acc;
}, {});
// loop items.
for (var [_, entries] of Object.entries(aggregateGroups)) {
// Aggregate results following the aggregateExpression.
yield Object.assign({}, entries.reduce((acc, next) => aggregateExpression(acc, next)));
}
}
// Aggregate duplicates of data, whose unique key is APP_ID.
const res = [...aggregateDuplicates(data, 'APP_ID', (a,b) => {
// In order to properly aggregate the INTERFACE property, acquire the set of entires interfaces of two items with the same APP_ID.
var interfacesSet = [...a.INTERFACE, ...b.INTERFACE];
// Finally, spread common values between them, then aggregate the INTERFACE property by its unique NAME key.
return Object.assign(a, b, {
INTERFACE: [...aggregateDuplicates(interfacesSet, 'NAME', (c,d) => {
// For that NAME property, just assign the values of both objects, nothing more nothing less.
return Object.assign(c,d)
})]
});
})];
console.log(res);
SIDE NOTE: The sorting to the INTERFACE property is not applied, this is a plus, but I don't think it's mandatory as long as the output data is effectively correct.

// Create the array of APP_ID
let idArr = data.map(val => val.APP_ID)
// Remove duplicate APP_ID
idArr = [...new Set(idArr)];
// Filter data according to unique APP_IDs
let newArr = idArr.map(val => {
return data.filter(value => value.APP_ID == val)[0]
})
console.log(newArr);

Solution
Here is a quick solution that I was able to come up with,
Note that this solution takes care of union of INTERFACES within the same APP_ID
const data = [
{
APP_ID: '1001',
INTERFACE: [
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'A',
},
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD',
URL: '/Dashboard',
STATUS: 'A',
},
{
INTERFACE_ID: '06',
NAME: 'SUMMARY COPC',
URL: '/SummaryCopc',
STATUS: 'A',
},
],
},
{
APP_ID: '1002',
INTERFACE: [
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD',
URL: '/Dashboard',
STATUS: 'A',
},
{
INTERFACE_ID: '08',
NAME: 'BIOMETRIC',
URL: '/Biometric',
STATUS: 'A',
},
],
},
{
APP_ID: '1001',
INTERFACE: [
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'A',
},
{
INTERFACE_ID: '05',
NAME: 'SUMMARY',
URL: '/Summary',
STATUS: 'A',
},
{
INTERFACE_ID: '06',
NAME: 'SUMMARY COPC 2',
URL: '/SummaryCopc2',
STATUS: 'A',
},
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD 2',
URL: '/Dashboard 2',
STATUS: 'A',
},
],
},
{
APP_ID: '1002',
INTERFACE: [
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD',
URL: '/Dashboard',
STATUS: 'A',
},
{
INTERFACE_ID: '08',
NAME: 'BIOMETRIC',
URL: '/Biometric',
STATUS: 'A',
},
],
},
];
const result = {};
data.forEach(elem => {
if (!result[elem.APP_ID]) {
result[elem.APP_ID] = {};
result[elem.APP_ID].APP_ID = elem.APP_ID;
result[elem.APP_ID].INTERFACE = elem.INTERFACE;
} else {
const interfaces = result[elem.APP_ID].INTERFACE;
for (const elemInterface of elem.INTERFACE) {
if (
!interfaces.some(inter => {
return elemInterface.INTERFACE_ID === inter.INTERFACE_ID;
})
) {
interfaces.push(elemInterface);
}
}
}
});
console.log('TCL: results', Object.values(result));
Assumptions:
Since you stated that you wanted union of the interfaces within the same APP_ID I assume that there should be no duplicate interfaces
Example: If there is an interface array A1,
[
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'A',
},
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD',
URL: '/Dashboard',
STATUS: 'A',
},
{
INTERFACE_ID: '06',
NAME: 'SUMMARY COPC',
URL: '/SummaryCopc',
STATUS: 'A',
},
]
and another interface array A2,
[
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'A',
},
{
INTERFACE_ID: '05',
NAME: 'SUMMARY',
URL: '/Summary',
STATUS: 'A',
},
{
INTERFACE_ID: '06',
NAME: 'SUMMARY COPC 2',
URL: '/SummaryCopc2',
STATUS: 'A',
},
{
INTERFACE_ID: '07',
NAME: 'DASHBOARD 2',
URL: '/Dashboard 2',
STATUS: 'A',
},
]
Then A1 union A2 would be,
[
{
"INTERFACE_ID": "01",
"NAME": "CIF OPENNING",
"URL": "/CusIdInfo",
"STATUS": "A"
},
{
"INTERFACE_ID": "07",
"NAME": "DASHBOARD",
"URL": "/Dashboard",
"STATUS": "A"
},
{
"INTERFACE_ID": "06",
"NAME": "SUMMARY COPC",
"URL": "/SummaryCopc",
"STATUS": "A"
},
{
"INTERFACE_ID": "05",
"NAME": "SUMMARY",
"URL": "/Summary",
"STATUS": "A"
}
]
Note that there are no duplicates.
My second assumption is that when you check for duplicity in interfaces you use the INTERFACE_ID and not the whole interface object.
Example: Assume an interface object I1,
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'A',
}
and another interface object I2 with the only difference being that it has a different status value which is 'B',
{
INTERFACE_ID: '01',
NAME: 'CIF OPENNING',
URL: '/CusIdInfo',
STATUS: 'B',
}
I am still considering I1 and I2 to be duplicates based on their INTERFACE_ID.
Suppose you want to compare entire object for duplicity then update your question and I shall change the answer to factor it in

Came up with this solution. Hope this works for you.
NOTE : In the expected result array you have 2 interface objects with same ID so i am assuming that two interface are duplicate only if all their properties match.
var data = [
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC",
"URL" : "/SummaryCopc",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1001",
"INTERFACE" : [
{
"INTERFACE_ID" : "01",
"NAME" : "CIF OPENNING",
"URL" : "/CusIdInfo",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "05",
"NAME" : "SUMMARY",
"URL" : "/Summary",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "06",
"NAME" : "SUMMARY COPC 2",
"URL" : "/SummaryCopc2",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD 2",
"URL" : "/Dashboard 2",
"STATUS" : "A"
}
]
},
{
"APP_ID" : "1002",
"INTERFACE" : [
{
"INTERFACE_ID" : "07",
"NAME" : "DASHBOARD",
"URL" : "/Dashboard",
"STATUS" : "A"
},
{
"INTERFACE_ID" : "08",
"NAME" : "BIOMETRIC",
"URL" : "/Biometric",
"STATUS" : "A"
}
]
}
];
isInterfaceDuplicate = function(interface, app_id) {
var keys = Object.keys(interface);
var isDuplicate = false;
app_map[app_id].forEach(app_obj => {
var matched = true;
keys.forEach(key => {
if (interface[key] !== app_obj[key]) {
matched = false;
return;
}
});
if (matched) {
isDuplicate = true;
return;
}
});
return isDuplicate;
};
/* Create a mapping for APP_ID and INTERFACE */
var app_map = {};
data.forEach(app_obj => {
// If APP_ID is not present in map, then add in map directly.
if (!app_map[app_obj.APP_ID]) {
app_map[app_obj.APP_ID] = [...app_obj.INTERFACE];
return;
}
// If APP_ID is present in map, only add non duplicate interfaces in APP_ID key.
app_obj.INTERFACE.forEach(interface => {
var isDuplicate = isInterfaceDuplicate(interface, app_obj.APP_ID);
if (!isDuplicate) {
app_map[app_obj.APP_ID].push({...interface});
}
});
});
/* Create result array from the map */
var result = [];
Object.keys(app_map).forEach(app_id => {
result.push({
"APP_ID": app_id,
"INTERFACE": app_map[app_id]
});
});
console.log(result);

Filtering realtime database data

I have the following firebase database. I would like to filter and list the orders which's deliveryDuration value is "45"
"orders" : [ null, {
"comment" : "",
"date" : "2018-07-09 10:07:18",
"deliveryDuration" : "45",
"delivery_address" : "",
"item" : [ {
"available" : true,
"category" : "Dessert",
"details" : "(Hausgemacht)",
"name" : "Warmer Topfenstrudel",
"price" : 3.9,
"quantity" : 1
} ],
"orderVerified" : false,
"telefon" : "",
"userID" : "xyc#gmail.com",
"userName" : ""
}, {
"comment" : "",
"date" : "2018-07-10 10:07:33",
"deliveryDuration" : "30",
"delivery_address" : "",
"item" : [ {
"available" : true,
"category" : "Dessert",
"details" : "(Hausgemacht)",
"name" : "Warmer Topfenstrudel",
"price" : 3.9,
"quantity" : 1
} ],
"orderVerified" : false,
"telefon" : "",
"userID" : "xyc#gmail.com",
"userName" : ""
}, {
"comment" : "",
"date" : "2018-07-10 10:13:13",
"deliveryDuration" : "10",
"delivery_address" : "",
"item" : [ {
"available" : true,
"category" : "Spezialitäten",
"details" : "Schweinschnitzel mit Parmesan gebacken auf Spaghetti Napoli",
"name" : "Piccata Milanese",
"price" : 12.9,
"quantity" : 1
} ],
"orderVerified" : false,
"telefon" : "",
"userID" : "xyc#gmail.com",
"userName" : ""
}
}
I tried writing the following function:
getNewItems: function (order) {
if (db.ref('orders').child(order).child('deliveryDuration').equalTo(45)){
return db.ref('orders').child(order).child('deliveryDuration')
}}
How could I get the filtered objects? I was thinking that that i write an if-else statement and the function returns the values what i was looking for.

I think you're looking for this:
getNewItems: function (order) {
return db.ref('orders').orderByChild('deliveryDuration').equalTo(45));
}}
This Firebase query takes each child node of the location you query, orders it by the deliveryDuration property, and then filters to only get the ones who are equal to 45.

Angular.js how to search in json array for given path

In my angular , i am having one $scope variable as below.
$scope.roleList2 = [
{ "roleName" : "User", "roleId" : "role1", "children" : [
{ "roleName" : "subUser1", "roleId" : "role11", "collapsed" : true, "children" : [] },
{ "roleName" : "subUser2", "roleId" : "role12", "collapsed" : true, "children" : [
{ "roleName" : "subUser2-1", "roleId" : "role121", "children" : [
{ "roleName" : "subUser2-1-1", "roleId" : "role1211", "children" : [] },
{ "roleName" : "subUser2-1-2", "roleId" : "role1212", "children" : [] }
]}
]}
]},
{ "roleName" : "Admin", "roleId" : "role2", "children" : [
{ "roleName" : "subAdmin1", "roleId" : "role11", "collapsed" : true, "children" : [] },
{ "roleName" : "subAdmin2", "roleId" : "role12", "children" : [
{ "roleName" : "subAdmin2-1", "roleId" : "role121", "children" : [
{ "roleName" : "subAdmin2-1-1", "roleId" : "role1211", "children" : [] },
{ "roleName" : "subAdmin2-1-2", "roleId" : "role1212", "children" : [] }
]}
]}
]},
{ "roleName" : "Guest", "roleId" : "role3", "children" : [
{ "roleName" : "subGuest1", "roleId" : "role11", "children" : [] },
{ "roleName" : "subGuest2", "roleId" : "role12", "collapsed" : true, "children" : [
{ "roleName" : "Banned Area", "roleId" : "role121", "children" : [
{ "roleName" : "subGuest2-1-1", "roleId" : "role1211", "Parent":"Banned Area" ,"children" : [] },
{ "roleName" : "subGuest2-1-2", "roleId" : "role1212", "Parent":"Banned Area", "children" : [] }
]}
]}
]}
];
I want to first find array for given path
Admin>subAdmin2-1
and insert
{ "roleName" : "subAdmin2-1-3", "roleId" : "role1213", "children" : [] }
Please guide, how can achieve this.

This is quick and dirty but will work:
for (var i=0; i<$scope.roleList2.length; i++) {
if ($scope.roleList2[i].roleName == "Admin") {
var subRoles = $scope.roleList2[i].children;
for (var k=0; k<subRoles.length; k++) {
if (subRoles[k].roleName == "subAdmin2") {
var subSubRoles = subRoles[k].children;
for (var j=0; j<subSubRoles.length; j++) {
if (subSubRoles[j].roleName == "subAdmin2-1") {
subSubRoles[j].children.push({ "roleName" : "subAdmin2-1-3", "roleId" : "role1213", "children" : [] });
console.log(subSubRoles[j]);
}
}
}
}
}
}
You can try improving with a recursion. And you probably want this to be in a function, so you can call
var role = "{ "roleName" : "subAdmin2-1-3", "roleId" : "role1213", "children" : [] }";
$scope.addSubRole(role, "Admin", "subAdmin2-1")

Display data in consistent format for array of documents

I have a collection personemail with array of documents
{ "Name" : "A", "Email" : [ { "EmailAddress" : "a#home.com", "EmailType" : "Home" }, { "EmailAddress" : "a#work.com", "EmailType" : "Work" } ] }
{ "Name" : "B", "Email" : [ { "EmailAddress" : "b#work.com", "EmailType" : "Work" } ] }
{ "Name" : "C" }
I have to display data in below format, ie if we a person is not having home / work address , it should be displayed as "No data" if home or work email is not available preferably in same order (Home email first , Work email second)
{ "Name" : "A", "Email" : [ { "EmailAddress" : "a#home.com", "EmailType" : "Home" }, { "EmailAddress" : "a#work.com", "EmailType" : "Work" } ] }
{ "Name" : "B", "Email" : [ { "EmailAddress" : "No Data", "EmailType" : "Home" }, { "EmailAddress" : "b#work.com", "EmailType" : "Work" } ] }
{ "Name" : "C", "Email" : [ { "EmailAddress" : "No Data", "EmailType" : "Home" }, { "EmailAddress" : "No Data", "EmailType" : "Work" } ] }
I thought of implementing this with $unwind or $switch function . Suggestions please

It's possible:
db.collection.aggregate([
{ "$project": {
"Name": 1,
"Email": {
"$map": {
"input": ["Home", "Work"],
"as": "m",
"in": {
"$ifNull": [
{ "$arrayElemAt": [
{ "$filter": {
"input": "$Email",
"as": "e",
"cond": { "$eq": [ "$$e.EmailType", "$$m" ] }
}},
0
]},
{ "EmailAddress": "No Data", "EmailType": "$$m" }
]
}
}
}
}}
])
Which produces:
{
"_id" : ObjectId("591e7d66cb1a9433dab779cc"),
"Name" : "A",
"Email" : [
{
"EmailAddress" : "a#home.com",
"EmailType" : "Home"
},
{
"EmailAddress" : "a#work.com",
"EmailType" : "Work"
}
]
}
{
"_id" : ObjectId("591e7d66cb1a9433dab779cd"),
"Name" : "B",
"Email" : [
{
"EmailAddress" : "No Data",
"EmailType" : "Home"
},
{
"EmailAddress" : "b#work.com",
"EmailType" : "Work"
}
]
}
{
"_id" : ObjectId("591e7d66cb1a9433dab779ce"),
"Name" : "C",
"Email" : [
{
"EmailAddress" : "No Data",
"EmailType" : "Home"
},
{
"EmailAddress" : "No Data",
"EmailType" : "Work"
}
]
}
But personally I'd do that transformation in client code, since it's less obtuse. As a quick shell example:
db.collection.find().forEach(doc => {
doc.Email = ["Home", "Work"].map( m => {
if (!doc.hasOwnProperty('Email'))
doc.Email = [];
var val = doc.Email.filter(e => e.EmailType === m)[0];
return (val == null) ? { "EmailAddress": "No Data", "EmailType": m }
: val;
});
printjson(doc);
})
Basically though you use your "uniform" array of "Home" and "Work" as a source to $map, then lookup the elements in the documents current Email array. anything that returned a null on the lookup is swapped with the default data.

RedQueryBuilder validations

I am using the RedQueryBuilder version 0.5.0
http://0-5-0.redquerybuilder.appspot.com/ for building an Expression validator.
I want to Know, how to validate the entered expressions?
The metadata of the RedQuery Builder 0.5.0 supports css and class additions for Jquery support.
Please, suggest how to add the css metadata to the existing metadata.
The Sample MetaData is given below:
meta : {
tables : [ {
"name" : "PERSON",
"label" : "Person",
"columns" : [ {
"name" : "NAME",
"label" : "Name",
"type" : "STRING",
"size" : 10
}, {
"name" : "DOB",
"label" : "Date of birth",
"type" : "DATE"
}, {
"name" : "SEX",
"label" : "Sex",
"type" : "STRING",
"editor" : "SELECT"
}, {
"name" : "CATEGORY",
"label" : "Category",
"type" : "REF",
} ],
fks : []
} ],
types : [ {
"name" : "STRING",
"editor" : "TEXT",
"operators" : [ {
"name" : "=",
"label" : "is",
"cardinality" : "ONE"
}, {
"name" : "<>",
"label" : "is not",
"cardinality" : "ONE"
}, {
"name" : "LIKE",
"label" : "like",
"cardinality" : "ONE"
}, {
"name" : "<",
"label" : "less than",
"cardinality" : "ONE"
}, {
"name" : ">",
"label" : "greater than",
"cardinality" : "ONE"
} ]
}, {
"name" : "DATE",
"editor" : "DATE",
"operators" : [ {
"name" : "=",
"label" : "is",
"cardinality" : "ONE"
}, {
"name" : "<>",
"label" : "is not",
"cardinality" : "ONE"
}, {
"name" : "<",
"label" : "before",
"cardinality" : "ONE"
}, {
"name" : ">",
"label" : "after",
"cardinality" : "ONE"
} ]
}, {
"name" : "REF",
"editor" : "SELECT",
"operators" : [ {
"name" : "IN",
"label" : "any of",
"cardinality" : "MULTI"
}]
} ]
},

Categories

Resources