Angularjs Skype URI "onclick" issue

Question

Im trying to implement Skype Button on the website Im working on using Angularjs

The code provided by the Skype API is the following

</script>
<div id="SkypeButton_Call_mike_1">
  <script type="text/javascript">
    Skype.ui({
      "name": "dropdown",
      "element": "SkypeButton_Call_mike_1",
      "participants": ["mike"],
      "imageSize": 32
    });
  </script>
</div>

Im using angularjs so the mike pseudo comes from my angular model (Controller).

$scope.user.skypePseudo = "mike"

Then when I change

"participants": ["mike"]

to

"participants": ["{{user.skypePseudo}}"]

It throws this error

Interpolations for HTML DOM event attributes are disallowed.  Please use the ng- versions (such as ng-click instead of onclick) instead.

The error is clear, it means I cannot use onclick and should use ng-click instead.

I have tried to modifiy the skype-uri.js by replacing all onclick by ng.click but get some compliation errors.

Is there someone that have experienced this before me ? How can I make it working ?

The question could be asked as : is there a way to force angular to accept onclick

Alexandre TRINDADE · Accepted Answer · 2014-04-30 07:48:37Z

4

I think the best way to achieve that is to create a new directive:

angular.module("yourApp")
.directive("skypeUi", function() {
    return {
        restrict: "E",
        template: "<div></div>",
        replace: true,
        scope: {
            participants: "="
        },
        link: function(scope, element, attrs){
            Skype.ui({
                "name": "dropdown",
                "element": attrs.id,
                "participants": scope.participants,
                "imageSize": 32
            });
        }
    };
});

So you can use like that;

<skype-ui id="SkypeButton_Call_mike_1" participants="participants">
</skype-ui>

And finally in your controller:

$scope.participants = ["mike"];

answered Apr 30, 2014 at 7:48

Alexandre TRINDADE

95710 silver badges22 bronze badges

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

1 Comment

Merlin Over a year ago

Copy pasted your code and it is working like a charm ! Thanks a lot !

Collectives™ on Stack Overflow

Angularjs Skype URI "onclick" issue

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related