2

Whatever i do ng-click of AngularJS in paper-button within polymer-element it doesn't work, is there any file to import? please tell me step by step what should i do.

<link rel="import" href="../components/polymer/polymer.html">

<link rel="import" href="../components/paper-button/paper-button.html"/>
<link rel="import" href="../components/core-signals/core-signals.html">


<polymer-element name="my-statut-footer_OnEdit">
  <template>
    <div class="tag-container">
        <paper-button class="shadow" ng-click='annulerClick()'>Annuler</paper-button>
        <paper-button class="colored shadow" ng-click='publierClick()'>Publier</paper-button>
    </div>
  </template>
  <script>
    Polymer('my-statut-footer_OnEdit',{
        });
  </script>
</polymer-element>
Leandro Carracedo
  • 7,233
  • 2
  • 44
  • 50
Afifa Rih
  • 171
  • 1
  • 7

3 Answers3

3

The best solution that I've found is to use polymer's on-click event, then inside the method select the angularjs controller by his id

    <paper-button on-click='publierClick()'>Publier</paper-button>

    Polymer('my-statut-footer_OnEdit',{
        publierClick: function(e, detail, sender) {
            var scope = angular.element(document.getElementById(('controllerID')))
                .scope();
            scope.$apply(function () {
                scope.publier();
            });
        }
    });
Afifa Rih
  • 171
  • 1
  • 7
1

Polymer and Angular are not compatible with each other.

Polymer makes extensive use of the brand new Web Components standards which Angular know literally nothing about so when Angular's Compiler comes across a Custom Element it tries to use it as a Angular Directive which it is actually not so it throws lot of errors.

Here are a few Solution:
Use ng-polymer-elements which helps Polymer elements be compatible with Angular.
Wait for Polymer 0.8 and hope it goes along with Angular.

While you are here please make sure to view some answers for the Following question this might help you understand some technical differences between polymer and angular:
What is the difference between Polymer elements and AngularJS directives?

Community
  • 1
  • 1
Adi
  • 5,560
  • 1
  • 24
  • 37
  • thank you for the response :) about ng-polymer-elements do you have any tutorial cause i don't know how can i use it thnx – Afifa Rih Mar 19 '15 at 09:14
  • I am sorry, I have not tried this tool for myself so my knowledge about ng-polymer-elements is very limited. – Adi Mar 19 '15 at 10:44
0

For now there is no efficient way to achieve it. I used Iframe to make it working. Hope will find better solution, but for now angular can't work efficient with shadow html generated by polymer.

Plootor
  • 61
  • 5