how to output value of object Object in handlebars

Question

I am super green with ember and handlebars and I hit a brick wall, so a little help is appreciated.

I have some json:

[{"_links":{
     "author":[
        {
           "embeddable":true,
           "href":"http:\/\/example.com\/users\/1"
        }
     ],}]

and in handlebars I am trying to get href like this

{{#each posts as |post|}}
    {{post._links.author.href}}
{{/each}}

but it returns nothing. author is an array but I don't know how to access it in handlebars, and what I read here on SO, I don't feel fits in context.

Ember Freak · Accepted Answer · 2016-08-13 17:04:08Z

2

author is an array so you cant access it like you did. try the below snippet.

{{#each posts as |post|}}
    {{#each post._links.author as |author|}}
       {{author.href}}
    {{/each}}
{{/each}}

If you would like to display always first element in author array then you do not require each block.

{{#each posts as |post|}}
    {{post._links.author.[0].href}}            
{{/each}}

edited Aug 13, 2016 at 17:04

answered Jul 24, 2016 at 15:50

Ember Freak

12.9k5 gold badges26 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sukima · Accepted Answer · 2016-07-24 17:39:18Z

0

If this data structure is something you dive into often you could consider a computed property:

import Ember form 'ember';
const { Controller, get, computed, computed: { alias } } = Ember;
export default Controller.extend({
  posts: alias('model');
  authorHrefs: computed('posts._links.[]', function () {
    return get(this, 'posts._links').reduce((memo, links) => {
      memo.push(...get(links, 'author').mapBy('href'));
      return memo;
    }, []);
  })
});

answered Jul 24, 2016 at 17:39

Sukima

10.1k4 gold badges48 silver badges60 bronze badges

6 Comments

sheriffderek Over a year ago

It seems like destructuring here clouds the point. It's cool, but for informational purposes on Stack Overflow - I think it does a disservice.

Sukima Over a year ago

Perhaps. Yet how will others learn advanced ES2015 without examples. I could write two examples. One for teaching and one for newer syntax standards. What do you think?

Sukima Over a year ago

I went to edit this and realized the alternative is yet another for loop with yet another temp variable. This seems worse. In my daily coding I find the destructuring is easier to comprehend then a for…of. Going to leave it and another answer can show what Ember would look like without ES2015 syntax if anyone wanted to post it.

odinp123 Over a year ago

Hi Sukima, Thanks for your answers. The first example I accepted, is what falls in line with what I was already doing. But your second example I am a bit confused. I create a new controller. It takes my model and extracts the posts._links.author.href from the result. How is it then called from handlebars? It looks like a smarter way to use it if I want to do something with the href ie. query for the username. What I would do with the first example was make a helper and use the href to query for the username like {{get-username author.href}}

Sukima Over a year ago

You access a computed property the same way. {{#each authorHrefs as |href|}} The HREF is: {{href}}. {{/each}}

|

Collectives™ on Stack Overflow

how to output value of object Object in handlebars

2 Answers 2

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related