Referencing angular function outside of scope

Question

I have the following code roughly. How can I access myFunction() outside of the angular code? Help is greatly appreciated. ng-click isn't working with the DOM manipulation I am doing, but ng-repeat isn't working as I would like. I can get onclick events to work within the generated content.

var app = angular.module('main', ['ui.bootstrap', 'ngTable']).controller('x', function ($scope, $filter, $http, $q, ngTableParams, $window) { var myFunction = function(){ some angular stuff } } //javascript function testFunction(){ angular.element(document.getElementById('x')).scope().myFunction(); }

The above code is what I have found from searching and does not work as I would like. Giving the error in console: Cannot read property 'myFunction' of undefined

edit: Here is the DOM manipulation I'm doing... myFunction has id as an argument being passed in my actual implementation.

usersArray[] //populated object array with name and id $scope.generateUsers = function(){ for(var i = 0; i < usersArray.length; i++){ document.getElementById("container").innerHTML += "<div ng-click='myFunction(" + usersArray[i].id + ")'> usersArray[i].name + "</div><br />"; } }

SOLUTION:

in the javascript function if I changed my code to:

function testFunction(supUserId) { angular.element(document.getElementById('HTMLElementId')).scope().myFunction(); }

Changing the element from the controller (x in my case) to an HTML element in the body of my page worked.

Maybe a better idea would be to share what DOM manipulation a you are doing to see if we can get my-click working — GPicazo
– GPicazo, Commented Aug 11, 2015 at 16:38
First thing to assess is why you are doing this in the first place? Most likely you need a directive but not much detail has been provided. There is almost never a need to use onclick. Please show your ng-repeat that isn't working. Important to understand that ng-repeat creates child scope for each item — charlietfl
– charlietfl, Commented Aug 11, 2015 at 16:53

Darshan Patel · Accepted Answer · 2015-08-11 17:57:57Z

myfunction is not declared inside scope. May be add ur myfunction inside like code below

var app = angular.module('main', ['ui.bootstrap', 'ngTable']).controller('x', function ($scope, $filter, $http, $q, ngTableParams, $window) { $scope.myFunction = function(){ some angular stuff } }

I made the change and it still does not work. Console error: Cannot read property 'myFunction' of undefined.

Collectives™ on Stack Overflow

Referencing angular function outside of scope

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related