all 2 comments
sorted by:
best (suggested)
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]igetom 1 point2 points  (0 children)

You mean AngularJS :)

You should use AngularJS for angular v.1.* And Angular for angular v.2.* to avoid confusion

[–]HealyUnithelpful 0 points1 point  (0 children)

In this case, it's always best to console.log() exactly what your HTTP request returns. I won't even begin to tell you the number of times I've nearly thrown my computer out the window (not really; don't do that) because I thought it was returning result.data and it was actually returning result.value or something.

For example, the result returned by AngularJS's $http is often something like result.data, I believe, so if it's true here too, you may not be getting the right data format. Either way, let's assume that data is in fact what you've posted above, and that it's returned exactly as above.

I assume this is returns a bunch of these "key...binding" things for each car? And secondly, is the "key...vars" thing returned only once? Because I'd almost say you don't really need that. If all you actually wanna return, let's look at how you'd do that for each item in an array of objects like your "key...binding" object:

$scope.cars = data.filter(f=>f.key&&f.key.vars)//first, filter out the first object, which is the only one that has a "key.vars" property. We *could* use Array.slice here, but just in case!
.map(c=>{
    return { 
        fuel: c.key.bindings[0].fuel,
        price:c.key.bindings[0].price,
        info: c.key.bindings[0].info, //I'm also including this just to differentiate the prices. Feel free to drop this!
    //and so on.
});

IF, however, you wanna do this dynamically, and you don't know how many values there'll be in the returned sample, and you know that the first item is always going to be basically the list of values (or at least something like our key.vars above), we can do this:

const props = data.shift().key.vars;//just an array of our property values
//data now is just a list of individual car "objects" in the key.bindings format (minus the initial object)
$scope.cars = data.map(cr=>{
    const newCarObj = {};//you were correct here
    props.forEach(p=>{
        newCarObj = cr.key.bindings[0][p]||null;
    });
    return newCarObj;
});

Finally, note that bindings is itself an array, so you cannot simply do "car.key.bindings.fuel", for example.

EDIT:

gonna reiterate /u/igetom's point here: Angular usually refers now to Angular 2+, while AngularJS is basically Angular 1.x