Call external js file function in Angular js controller

Question

I have the external js file which has more functions.

I need to call these functions from angular controller.

For example: external.js

...
...
function fun() {
  ...
  ...
}
...
...

Controller: acccountController.js

myApp.controller('AddAccountController',function ($scope,AddAccountLoginServices,$location,localStorageService,$compile,toaster){
   ....
   ....

   $scope.getLoginForm = function(siteId,name) { 
            ...
            ...
            fun(); // This function from external.js file
   });

   ...
   ...

});

I have imported external.js before the acccountController.js. But it doesnt calling that function. And also i have not get any console error for this.

How to achieve this... Thanks in advance.

How have you imported the external js in the angular module? — Shikhar
– Shikhar, Commented Jan 21, 2015 at 19:59

nilsK · Accepted Answer · 2014-05-16 14:57:06Z

10

EDIT: gave wrong answer, my bad. the following example works.

your external file should like this:

var doSomething = (function () {
  "use strict";
   return {
      test: (function () {
        return 'test';
      }()),
      test2: (function () {
        return console.log('test 2');
      })
   };
}());

and in your controller you call your scripts function:

console.log(doSomething.test);

or

doSomething.test2();

i learned something too, thanks ;)

edited May 16, 2014 at 14:57

answered May 16, 2014 at 14:19

nilsK

4,3512 gold badges28 silver badges40 bronze badges

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

2 Comments

user2731645 Over a year ago

Thanks for your response. I am newbie for angular js. if i put var external = require('assets/plugins/form-generation/js/external.js'); in controller means, i get this console error "ReferenceError: require is not defined".

nilsK Over a year ago

i'm sorry, require is node.js only ... my mistake. ...still trying ;)

Kshitij · Accepted Answer · 2015-06-28 09:41:25Z

6

As mentioned by @nilsK, you define a self invoking function. And then reference to it via window object. For example -

(function functionName(){
    Do Something Here...
})();

And then,

window.functionName();

And if your are using AngularJS,

$window.functionName();

answered Jun 28, 2015 at 9:41

Kshitij

6391 gold badge10 silver badges25 bronze badges

1 Comment

Tunde Pizzle Over a year ago

$window should be injected, for angular

Shailendra · Accepted Answer · 2015-10-04 14:34:11Z

1

I have similar situation and I did not have to make it self invoking function. Including the external js file into the html and it worked fine.

answered Oct 4, 2015 at 14:34

Shailendra

111 bronze badge

Comments

Tuấn Anh · Accepted Answer · 2014-05-16 15:17:31Z

0

Where is you call $scope.getLoginForm()?. I think you never call it. So fun() is not called, so you not see any thing. You need call $scope.getLoginForm(). Two way to call In HTML <button ng-click="getLoginForm()"></button> Or in Javascript $scope.getLoginForm() Good luck !

answered May 16, 2014 at 15:17

Tuấn Anh

216 bronze badges

Comments

Vijay Mishra · Accepted Answer · 2020-09-29 09:43:21Z

0

You need to create a global instance of the function.

Add a line:

var abc= new funcName(); at the end of the File and you can use this line (var abc= new funcName();) in your controller to invoke any methods from this file by using abc.methodName.

answered Sep 29, 2020 at 9:43

Vijay Mishra

392 bronze badges

Collectives™ on Stack Overflow

Call external js file function in Angular js controller

5 Answers 5

2 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related