<sortable-column> access json object property

[mmatecki]

Hi, I've got and JSON with some objects inside it. I'd like to display properties in column. I thought about such construction: sortable-column name="author.email" sortable="true">Email</sortable-column> However no value is displayed. If I put only author in name attribute I've JS [object] on screen. Any idea how to solve quickly? Regards,

[masonlouchart]

I think the sortable-column name has to be simply equals of the model property to display. In this case, try email instead of author.email.

The fact is, between the sortable-table tags, the model is automatically bound. In your case, you try to access the property this.author.email when this is already an author.

I hope my english is enough correct to be understood.

[stevenrskelton]

Allowing for too much flexibility in the column name leads to a lot of complication in the code.

Anything outside the normal direct binding can be achieved using a formula:

<sortable-table>
    <sortable-column name="id"></sortable-column>
    <sortable-column name="firstName" formula="function(r){ return r.author.firstName; }" sortable="true"></sortable-column>
    <sortable-column name="lastName" formula="function(r){ return r.author.lastName; }"></sortable-column>
    <sortable-column name="email" formula="function(r){ return r.author.email; }" sortable="false"></sortable-column>
[
    { "id":"1", author: { firstName: "Jimmy", lastName: "McNulty", email: "jm@thewire" }},
    { "id":"2", author: { firstName: "Avon", lastName: "Barksdale", email: "ab@thewire" }},
    { "id":"3", author: { firstName: "Bubbles", lastName: "", email: "bubbles@thewire" }},
    { "id":"4", author: { firstName: "Omar", lastName: "Little", email: "omar@thewire" }}
]
</sortable-table>

[masonlouchart]

Thanks for this trick :+1: