Angular Polymer data-binding

Question

I want to make two way data binding between Polymer and Angular, for this I am using Angu-poly library.

Here is a link to an example which is working, while passing strings via name and age attributes: working.

<x-kid bind-polymer ng-repeat="kid in kids" angupoly="{name:'kid.name', age:'kid.age'}">
</x-kid>

But when I try to make it with passing an object via kid attribute, it seems that something goes wrong, here is the link: not working.

<x-kid bind-polymer angupoly="{kid:'kid'}">
</x-kid>

What should I do to make it work?

Update:
Also tried it with this library and it didn't work. the code will look like this:

<x-kid bind-polymer kid={{kid}}>
</x-kid>

Big Update:
Here I made some progress tweaking the "angular-bind-polymer" library. For now I am able to bind objects from outside polymer into polymer, here is the updated plunker. The problem now is to do this in the other direction.
Note: I am getting some exception from angular side, take a look maybe you can help to solve it. I think we are very close :).

Answer 1

Here is an updated example http://plnkr.co/w1icAU

With Polymer 1.0 two way binding is much simpler and also able to bind objects not just string values.

Here is the main part

<x-kid ng-repeat="kid in ::kids" angupoly="{name:'kid.name', age:'kid.age'}"></x-kid>

Answer 2

I think it is because of some kind of reference.

How should I explain, just like you work with object in scope in data binding. when you update the object to a new object, the UI will not update with new object values.

Answer 3

It looks that Material Design is THE answer, excerpt:

Our goal is to deliver a lean, lightweight set of AngularJS-native UI elements that implement the material design system for use in Angular SPAs.

Answer 4

Maybe you could find clues from this blog even if its aim is for dart:

Angular and Polymer Data Binding, Together!

Answer 5

Also take a look at ng-polymer, this project may help give you some insight