Angular JS ng-options to access object inside object not working - javascript

I am trying to create couple select buttons that will be dynamic, and for the first one it worked fine using ng-options.
<select ng-options="muscles.name for muscles in bigdata.muscles track by muscles.id" ng-model="selected"></select>
Now as for the second one, it simple didnt work, or didnt print.
<select ng-options="exercises.name for exercises in bigdata.exercises" ng-model="selected"></select>
and the third one, printed the full array, instead of separating it.
<select ng-options="reps for reps in bigdata.muscles.reps" ng-model="selected"></select>
My Json file looks like this:
{
"name": "Gym App",
"muscles":[
{
"id":1,
"name": "chest",
"reps": [4,6,7,8,9,10,11,12],
"weight": [2,4,6,8,10,12,16,18,20,22,24,26,28,30],
"image": "img/muscles/chest.jpg",
"exercises": [
{
"name": "ALTERNATING FLOOR PRESS",
"rating": 6.1
}, (and goes on with exercises)...
Do objects inside objects need to be treated different?
Thanks

There are some mistakes. muscles is array, not object.
2) replace from bigdata.exercises to bigdata.muscles[0].exercises
3) replace from bigdata.muscles.reps to bigdata.muscles[0].reps
Then, it will work

Related

Remove object key prefixes nodejs

This is my first post. I don't like ask help in forums, but I have no choice. I spent a lot of days trying resolve this but I haven't found any solution.
All my problem start with an database query that returns this.
{
"prod_format": "400 ml",
"prod_brand": "Marca",
"prod_image": "192.168.1.45/mini/1046332bb531ab3.jpg",
"prod_name": "Gel de baño o ducha",
"prod_pvp": 2.20,
"prod_shops": [
{
"prod_price": 2.29,
"prod_shop": {
"prod_shopID": 2,
"prod_shop_name": "Tienda",
"prod_shop_image": "192.168.1.45/shops/d4d4sw2.jpg"
}
},
{
"prod_price": 2.19,
"prod_shop": {
"prod_shopID": 5,
"prod_shop_name": "Tienda",
"prod_shop_image": "192.168.1.45/shops/g4hbe72.jpg"
}
}
]
}
I want remove prefixes of keys, prod_ and shop_ in this case.
I can't do this by hand because this is only one of multiple queries that i use, and this data can change, i need an dynamic function that remove these prefixes, to use with more prefixes and more queries.
So far I have been trying:
Recursive function that calls itself to remap inside objects and
arrays, but it doesn't work because NodeJS is asynchronous and make an
loop that never ends.
Use an list function that gets all keys/values to make a new object
with renamed keys, but i cant found anything that works with complex
objects.
Use chained promises, i can't get that it works, but i think that
it is the best way to do this.
In conclusion I want an function that if I put the upper object, I get this code.
{
"format": "400 ml",
"brand": "Marca",
"image": "http://192.168.1.45/mini/1046332bb531ab3.jpg",
"name": "Gel de baño o ducha",
"pvp": 2.20,
"shops": [
{
"price": 2.29,
"shop": {
"shopID": 2,
"name": "Tienda",
"image": "http://192.168.1.45/shops/d4d4sw2.jpg"
}
},
{
"price": 2.19,
"shop": {
"shopID": 5,
"name": "Tienda",
"image": "http://192.168.1.45/shops/g4hbe72.jpg"
}
}
]
}
PS:
I can't edit the original object, because it comes of elasticsearch and i can't edit object keys.
Thanks in advance, I hope that anyone can help me.
Why don't you simply treat your Json data as a string and then replace '"_prod' with '"'? That would remove all occurances of this prefix.
myJsonString.replace('"_prod', '"');
Update: If your values may contain your prefixes, you better use regular expressions instead, just to make sure you only change the keys.

Ng-repeat of keys in a nested object

I am trying to use ng-repeat to create list of checkboxes for the keys in a nested object.
My object loosk like:
$scope.kids = [
{
"name": "Will",
"age": 6,
"skills": {
"dancing": false,
"coloring": true
}
},{
"name": "Sally",
"age": 7,
"skills": {
"dancing": false,
"coloring": true,
"runnning": true
}
}
];
and I would like a unique list of the keys in the "skills" object with each skill listed only once, not once for each kid. (i.e. "dancing", "coloring", "running")
This was helpful, but I still can't get a unique list after trying the nested repeats
Here's my current attempt on JSFiddle
Thanks!
Modify Your HTML
I think you need to change your html, remove your ng-repeats with this
<span ng-repeat="kid in kids">
<span ng-repeat="(key,skill) in kid.skills">
<input type="checkbox" ng-modle="{{skill}}"> {{key}}
<br>
</span>
</span>
This should give you a list of boxes connected to the correct $scope and titles.
Here is a link to the modified jsfiddle
Edit
I've modified the code to display a list of all the kids and then within that list we have a list of all of the kids individual skills. Its basically about understanding how loops work.
If I got your question correctly, the best solution for you will be to build a filter that extracts the keys, sorts them and pull unique values. Then you can use it in a single repeat. I forked your jsfiddle and added the filter.
I chose to use lodash to quickly pull out the values, flatten, sort and remove dups. Lodash is a huge playground and you could make the filter even more shorthand.
Since you have a repeating access to this filter, I'd suggest you use memoize to avoid redundant evaluation of the filter. Once it is computed, it is good enough. The basic memoization uses a single key and will not be able to account for other parameters but you can override it and take all params into account and have an accurate and efficient memoization.
The filter is defined like so:
mymodule.filter('uniqueKeys', function(){
return function(input, keyPath){
return _.unique(_.sortBy(_.flatten( _.map(input,
function(item){return _.keys(_.get(item, keyPath));}))));
}
});
and the repeater would be:
<div ng-repeat="skill in kids | uniqueKeys:'skills'">
Note that I pass in the key to find your values, if you had hobbies field that'd you'd like to extract, you just have to write:
<div ng-repeat="skill in kids | uniqueKeys:'hobbies'">

Need an algorithm to convert string to JSON with javascript

I'm calling an api for the history of an ID which returns a string object that looks like this:
09304790130000--09304790090000
09304790130000--09304790120000
09304790090000--09304790010000
09304790120000--09304790020000
09304790120000--09304790030000
09304790120000--09304790110000
09304790110000--09304790050000
09304790010000--042322003
09304790020000--042322002
09304790030000--042322001
09304790050000--042322004
I could do so much more with it if I could figure out how to use JavaScript to convert it to JSON so it would look like this:
{
"name": "09304790130000",
"children": [{
"name": "09304790090000",
"children": [{
"name": "09304790010000",
"children": [{
"name": "04 2322-003"
}]
}]
}, {
"name": "09304790120000",
"children": [{
"name": "09304790020000",
"children": [{
"name": "04 2322-002"
}]
}, {
"name": "09304790030000",
"children": [{
"name": "04 2322-001"
}]
}, {
"name": "09304790110000",
"children": [{
"name": "09304790050000",
"children": [{
"name": "04 2322-004"
}]
}]
}]
}]
}
Is there an algorithm I can use that can construct the object I need regardless of how complicated the "tree" becomes?
EDIT for clarity:
The "--" in the string represents the relationship of the ID's. The left ID is the parent of the ID right of the dashes. So the ID that I feed the api, "09304790130000" has two children, each could have more children until they reach the current 9-digit ID.
What you have here is an input that is in a custom format. What you need to handle it is a regular expression. (Although your format might be simple enough that a full on regex function is not required so much as splitting on separators?) You need to do is break the input string up and loop over the components and put those into your desired data structure (which sounds like it would be some kind of tree). The high level pseudo-code would be something like:
Take line of input.
Break on "--".
Create root node from the left side if the tree is empty, otherwise just find the existing node.
Add child from right side to the parent.
Getting it into the JSON format you want may require also writing a function that iterates over the tree and writes a string in that format... although if you are using existing libraries and data types this probably already exists.
EDIT: To expand on the last bit, to get the format you want would mean a Pre-order traversal of the tree. At each step you just add the formatting and name to the JSON String. One of these libraries should have the capabilities you need, although obviously you can write a tree data structure and traversal function yourself if you need to.

parsing JSON object with Jquery problem

Hi I am trying to parse the following bit of json with Jquery so far I can get everything out of the results that I want apart from one crucial piece of information the performance tags.
Each json result is wrapped in an event tag and then within this there is info like time and date etc formatted in the following way
"location": {
"lng": -0.1187418,
"city": "London, UK",
"lat": 51.4681089
},
"start": {
"time": "19:30:00",
"datetime":"2010-02-16T19:30:00+0000",
"date": "2010-02-16"
},
I have managed to loop through this and parse it to html. However there is one set of tags for 'performance' that are formatted differently.
"performance": [{
{
"artist": {
"uri": "http://www.songkick.com/artists/288696-vampire-weekend",
"displayName": "Vampire Weekend",
"id": 288696,
"identifier": [{"mbid": "af37c51c-0790-4a29-b995-456f98a6b8c9"}]
}
"displayName": "Vampire Weekend",
"billingIndex": 1,
"id": 5380281,
"billing": "headline"
}
}],
now in my for loop i am running the following code which displays the performance information in the console.
var events = data.resultsPage.results.event;
for (var i = 0, l = events.length; i < l; i++) {
console.log(events[i].performance); }
However when i try to go into the structure like i have been with the other elements I get returned undefined i.e
console.log(events[i].performance.displayName);
Do I have to do this in a different way because of the use of the [ ] brackets in the performance tag in the Json?
Thanks in advance
Assuming that what you posted is not exactly what your JSON looks like (because what's posted has a syntax error), the "performance" attribute is an array of objects. To get at the "displayName", therefore, you'd need to know which element of the "performance" array you wanted. You'd then access it by index.
console.log(events[i].performance[j].displayName);
(assuming you looped through the "performance" array with the variable "j".)
Try to validate your returned JSON object here, I guess there is some issue with the JSON output..

Selecting a subarray in a javascript object using jQuery/jHashtable

I have an object like this:
var data = {
"info" : [{
"title": "Desemberkonsert",
"description": "MangerFHS 09/10"
}],
"playlist" : [
{
"title": "In This Place",
"description": "Excalibur",
"href": "desemberkonsert_in-this-place",
"url": "flv/desemberkonsert/21_in_this_place.flv",
"thumbnail": "flv/desemberkonsert/21_in_this_place_thumbnail.png",
"time": "5:39"
}]
}
And I am trying to do a search using jHashtables containsValue-function (I am willing to settle for any other search method that works though), like this containsValue(data.playlist, 'Excalibur'). But for some reason, this returns false. How would I select the array that contains the the value Excalibur from the code above?
I could not find a decent method inherently available in JavaScript or the jQuery library, but using a smaller library named jLinq (http://jlinq.hugoware.com/), doing it was a breeze. It allows me to filter with many different methods (I am using the 3.x beta though).
EDIT: The thing I missed was that the lowest arrays behave like objects too. But as Šime Vidas pointed out, I can select a subarray like this: data.playlist[0], and an item within that like this: data.playlist[0].description.

Categories

Resources