How do I call a javascript method from angular js?

Question

I need to call a JavaScript method from angular.js when a sound ends. I want to call the check() function which is inside in the ready method.

app.controller("myCtrl",function($scope,ngAudio,$document)
    {
        $scope.audio;
        $scope.play=function(myAud)
        {
            $scope.audio = new Audio(myAud)
            $scope.audio.play();
            $scope.audio.onended=function()
            {
                console.log("called");
                $scope.audio = new Audio('aud1.mp3');
                $scope.audio.play();
                $scope.check();
            }
        }
        $scope.stop=function()
        {
            $scope.audio.stop()
        }
         $document[0].addEventListener("visibilitychange", function() {
        var doucmentHidden = document.hidden;
        if (doucmentHidden)
        {
            console.log("called");
            $scope.audio.pause();
        }
        else
        {
            console.log("called");
            $scope.audio.play();
        }
        }, false);
    });
    </script>
    <script>
        $(document).ready(function()
        {
            var aud= angular.element(document.getElementById('container')).scope();
             aud.play('aud.mp3');
                 function check()
                 {
                    console.log("called1");
                }
        });
    </script>

How can I trigger the check() function when I need to?

Being new to angular, you should give this a read: http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background. It helped me a lot! — Wesley Smith, Mar 31 '15 at 12:23

Jai · Accepted Answer · 2015-03-31T12:24:14.233

As i see your check() function is in different script block and in a different scope. Instead you should put that in the controller's scope, so that it would be available to use:

    app.controller("myCtrl", function($scope, ngAudio, $document) {
      $scope.audio;
      $scope.check = function(){ // declare it here.
          console.log('check called on end.');
      };
      $scope.play = function(myAud) {
        $scope.audio = new Audio(myAud)
        $scope.audio.play();
        $scope.audio.onended = function() {
          $scope.check(); // now it can use the check function from the $scope
        }
      }
      $scope.stop = function() {
        $scope.audio.stop()
      }
      $document[0].addEventListener("visibilitychange", function() {
        var doucmentHidden = document.hidden;
        if (doucmentHidden) {
          console.log("called");
          $scope.audio.pause();
        } else {
          console.log("called");
          $scope.audio.play();
        }
      }, false);
    });
     // remove the script tags and put both in a same script block 
    $(document).ready(function() {
      var aud = angular.element(document.getElementById('container')).scope();
      aud.play('aud.mp3');
    });

How do I call a javascript method from angular js?

1 Answers1