Object as a custom-element attribute

[Sara Alvarez-Ude Garrido]

Hi, I'm having lots of trouble trying to pass an object as a polymer attribute. I asked around stackoverflow but none of the answers have solved my problem, I'm thinking maybe there's something else I'm not seeing or I misunderstood a concept.

I know I should probably ask this only around in stackoverflow, but I've asked a couple of questions while trying to understand Polymer and so far haven't got many answers, so I figured here would be easier to find someone who can help me. If this is a bad thing to post, I'm sorry.

Now, what I think should work (and doesnt):

In my main page (which is wrapped in a template with id="fulltemplate" and auto.binding) I create this profile-page element:

<profile-page id="profpage" isProfile="true" entity="{{profEntity}}"></profile-page>

and on document.ready I set 

$.getJSON('api/userProfile.json', function (data) {

                var jsonString = JSON.stringify(data);

                maintemplate.profEntity = jsonString;

            });

what I pass, at the end, is something like ' { "data":"value", "data2":"value2" } ' and so on.

Then, in my profile-page element (which has the entity attribute) i have a couple of labels like

           <core-label class="namepro">{{entity.data}}</core-label>

           <core-label class="subpro">{{entity.data2}}</core-label>

and so on, and I establish that entity is an object with this.

Polymer({

            entity: { },

            some other code

          });

I honestly thought this should work, but doesn't, and the only thing I can think of is that maybe the reason is that I update the attribute after the document is ready, and not on the creation of the element?

Thanks for reading, and sorry again if this is not the place to write this.