Using AngularJS Values in JavaScript Function

Question

I have a function that calls some code using the Jcrop API that takes in some values to set aspect ratio. However, I need those values to come from a data connection for which I'm using Angular. So I need something like this:

<img src="sample.jpg" onclick="setAspectRatio({{valueToSet}});" />

But I get this error when trying to do it that way. If I do it this way:

<img src="sample.jpg" ng-click="setAspectRatio({{valueToSet}});" />

Then valueToSet actually evaluates, but I can't call it this way as setAspectRatio() isn't defined in any controller (it's a script on my page itself). This is mainly because it uses Jcrop and I didn't want to mix Jcrop with my Angular controller.

How can I accomplish what I'm trying to do here?

Timothy · Accepted Answer · 2014-08-18 18:37:18Z

2

You don't need the {{}} around the variable name. ng-click=setAspectRatio(valueToSet) should work.

answered Aug 18, 2014 at 18:37

Timothy

1,1603 gold badges13 silver badges33 bronze badges

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

4 Comments

runTarm Over a year ago

OP said that the setAspectRatio function is not on the controller's $scope.

muttley91 Over a year ago

Yeah setAspectRatio has to be defined on the page itself because it uses Jcrop.

Timothy Over a year ago

Ah, totally missed that. :( have you tried something along the lines of... angular.element(document.querySelector('[ng-controller="controllerNameHere"]')).scope().variableName

Timothy Over a year ago

Example... something like stackoverflow.com/questions/17960622/…

Collectives™ on Stack Overflow

Using AngularJS Values in JavaScript Function

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related