I'm using PURE from BeeBole for filling some HTML templates with JSON, everything works perfect except that I can't find how to pass a default value when a missing property, and I wanted to do this from this side since from the server there is nothing I can do. So for example I have this JSON object:
var example = {records: [ {id: '1', name: 'Bill', nick: 'B'}, {id: '2', name: 'Amy'} ]}
When I render this in a table, on the directive when I ask for 'nick' I get 'B' for the first and nothing for the second, but for this case I would like to set a default value such as '-' when the property is not found.
Is this possible?
Thank you
A bit late on this one.
If you want to show the nick in a SPAN, it should look something like:
'span':function(){
return this.nick || '-';
}
instead of:
'span':'nick'
You would probably get a quicker answer on the forum
Related
Let's say i have 2 objects each with the same properties but one has an extra property middleName and the other does not.
How should i handle this in DC.js?
var objects = [{
name: "De Smet",
firstName: "Jasper",
adress: "Borsbeke",
},{
name: "De Backer",
firstName: "Dieter",
middleName: "middleName",
adress: "Borsbeke"
},{
name: "De Bondtr",
firstName: "Simon",
middleName: "OtherMiddleName",
adress: "Denderleeuw"
}
]
The wanted behaviour would be that the object without the property gets filtered out. Like so:
Here is a fiddle:
https://jsfiddle.net/mj92shru/41/
It seems to add the property middlename to the first object and assigns it the next middlename it finds
Adding the property to the first object and adding a placeholder value like "none" works but it doesnt really produce wanted behaviour.
I realize i could filter out the objects where the middlename is set to "none" but this would be difficult in the actual application i am writing
i've also found that adding the object without the property last causes it to crash.
Indeed, using undefined fields for your dimension or group keys can crash crossfilter because it does not validate its data. NaN, null, and undefined do not have well-defined sorting operations.
It's strange to see the value folded into another bin, but I suspect it's the same undefined behavior, rather than something you can depend on.
If you have fields which may be undefined, you should always default them, even if you don't want the value:
middleNameDimension = j.dimension(d => d.middleName || 'foo'),
I think you do want to filter your data, but not in the crossfilter sense where those rows are removed and do not influence other charts. Instead, it should just be removed from the group without affecting anything else.
You can use a "fake group" for this, and there is one in the FAQ which is suited perfectly for your problem:
function remove_bins(source_group) { // (source_group, bins...}
var bins = Array.prototype.slice.call(arguments, 1);
return {
all:function () {
return source_group.all().filter(function(d) {
return bins.indexOf(d.key) === -1;
});
}
};
}
Apply it like this:
.group(remove_bins(middleNameGroup, 'foo'))
Fork of your fiddle.
Be careful with this, because a pie chart implicitly adds up to 100%, and in this case it only adds up to 66%. This may be confusing for users, depending how it is used.
In our Angular project, we use interpolation as shown below, but we also need to use this interpolated value in the [state] property. But we haev not managed so far. Any idea?
If we set id values as shown below, there is no problem.
<a routerLink="/ticket/details/" [state]="{ id: '5' }" >{{row.TicketId}}</a>
But we cannot get dynamically by obtaining row.TicketId (it is obtained as label in {{row.TicketId}}) but cannot concatenate with id parameter.
<a routerLink="/ticket/details/" [state]="{ id: {{row.TicketId}} }" >{{row.TicketId}}</a>
The brackets in [state]="..." tell Angular to evaluate the template expression, so you cant use interpolation there. So, as I said in comment it should be:
[state]="{ id: row.TicketId }"
Try [state]="{ id: row.TicketId }"
I am converting a shopping basket to an immutable structure.
Is there an easy way with immutablejs to see if an immutable object already exists within an immutable list EXCEPT for one object property 'quantity' which could be different? List example:
[{
id: 1,
name: 'fish and chips',
modifiers: [
{
id: 'mod1',
name: 'Extra chips'
}
],
quantity: 2
},{
id: 2,
name: 'burger and chips',
modifiers: [
{
id: 'mod1',
name: 'No salad'
}
],
quantity: 1
}]
Now, say I had another object to put in the list. But I want to check if this exact item with modifiers exists in the list already? I could just do list.findIndex(item => item === newItem) but because of the possible different quantity property then it wont work. Is there a way to === check apart from one property? Or any way to do this without having to loop through every property (aside from quantity) to see if they are the same?
Currently, I have an awful nested loop to go through every item and check every property to see if it is the same.
Well this should work-
list.findIndex(item => item.delete("quantity").equals(newItem.delete("quantity"))
The equals method does deep value comparison. So once you delete the quantity, you are comparing all values that matter.
PS: please ignore code formatting, I am on SO app.
PPS: the above code is not optimal, you should compare a pre-trimmed newItem inside the arrow function instead of trimming it there.
I am building a CSV file parser through node and Angular . so basically a user upload a csv file , on my server side which is node the csv file is traversed and parsed using node-csv
. This works fine and it returns me an array of object based on csv file given as input , Now on angular end I need to display two table one is csv file data itself and another is cross tabulation analysis. I am facing problem while rendering data, so for a table like
I am getting parse responce as
For cross tabulation we need data in a tabular form as
I have a object array which I need to manipulate in best possible way so as to make easily render on html page . I am not getting a way how to do calculation on data I get so as to store cross tabulation result .Any idea on how should I approach .
data json is :
[{"Sample #":"1","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"2","Gender":"Male","Handedness;":"Left-handed;"},{"Sample #":"3","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"4","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":"5","Gender":"Male","Handedness;":"Left-handed;"},{"Sample #":"6","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":"7","Gender":"Female","Handedness;":"Right-handed;"},{"Sample #":"8","Gender":"Female","Handedness;":"Left-handed;"},{"Sample #":"9","Gender":"Male","Handedness;":"Right-handed;"},{"Sample #":";"}
There are many ways you can do this and since you have not been very specific on the usage, I will go with the simplest one.
Assuming you have an object structure such as this:
[
{gender: 'female', handdness: 'lefthanded', id: 1},
{gender: 'male', handdness: 'lefthanded', id: 2},
{gender: 'female', handdness: 'righthanded', id: 3},
{gender: 'female', handdness: 'lefthanded', id: 4},
{gender: 'female', handdness: 'righthanded', id: 5}
]
and in your controller you have exposed this with something like:
$scope.members = [the above array of objects];
and you want to display the total of female members of this object, you could filter this in your html
{{(members | filter:{gender:'female'}).length}}
Now, if you are going to make this a table it will obviously make some ugly and unreadable html so especially if you are going to repeat using this, it would be a good case for making a directive and repeat it anywhere, with the prerequisite of providing a scope object named tabData (or whatever you wish) in your parent scope
.directive('tabbed', function () {
return {
restrict: 'E',
template: '<table><tr><td>{{(tabData | filter:{gender:"female"}).length}}</td></tr><td>{{(tabData | filter:{handedness:"lefthanded"}).length}}</td></table>'
}
});
You would use this in your html like so:
<tabbed></tabbed>
And there are ofcourse many ways to improve this as you wish.
This is more of a general data structure/JS question than Angular related.
Functional helpers from Lo-dash come in very handy here:
_(data) // Create a chainable object from the data to execute functions with
.groupBy('Gender') // Group the data by its `Gender` attribute
// map these groups, using `mapValues` so the named `Gender` keys persist
.mapValues(function(gender) {
// Create named count objects for all handednesses
var counts = _.countBy(gender, 'Handedness');
// Calculate the total of all handednesses by summing
// all the values of this named object
counts.Total = _(counts)
.values()
.reduce(function(sum, num) { return sum + num });
// Return this named count object -- this is what each gender will map to
return counts;
}).value(); // get the value of the chain
No need to worry about for-loops or anything of the sort, and this code also works without any changes for more than two genders (even for more than two handednesses - think of the aliens and the ambidextrous). If you aren't sure exactly what's happening, it should be easy enough to pick apart the single steps and their result values of this code example.
Calculating the total row for all genders will work in a similar manner.
This should be a fairly simple one.
myobject has various properties, _id, name, createdBy, date etc
In my find query I want to only return specific fields from within myObject. So for example, what would I need to do to modify the find query below so that only name was returned?
myCollection.find({createdBy: someId}, {fields: {myObject: 1}}).fetch();
Currently this will return everything in myObject which it should do, I just want one field within myObject returned.
Here is a way to do it within the query:
myCollection.find({createdBy: someId}, {fields: {'myObject.name':
1}}).fetch();
Note the quotes around
'myObject.name'
Lets assume we are talking about posts, and a post document looks like this:
{
_id: 'abc123',
title: 'All about meteor',
author: {
firstName: 'David',
lastName: 'Weldon'
}
}
You can then extract all of the last names from all of the authors with this:
var lastNames = Posts.find().map(function(post) {
return post.author.lastName;
});
Modify the selector and options as needed for your collection. Using fields in this case may be a small optimization if you are running this on the server and fetching the data directly from the DB.