How to pass a variable from jQuery to Angular property

Question

I have a property inside an angular app called selected_tax, how can I pass a variable to this from jQuery?

I have a list of items that get filtered by their categories, I need a way to link to a pre-filtered list of category items. Currently, jQuery grabs a variable passed through the URL which is the category number.

why do you need jQuery to do this? Show some code

charlietfl
– charlietfl

2015-02-25 16:50:10 +00:00
Commented Feb 25, 2015 at 16:50 — charlietfl
– charlietfl, Commented Feb 25, 2015 at 16:50

simon · Accepted Answer · 2015-02-25 17:18:49Z

1

You can access the scope from the "outside world". Just make sure you wrap the code inside a setTimeout to allow angular to do its magic and then invoke digest.

<div ng-app="app" ng-controller="ctrl" id="myapp">{{xxx}}</div>
<script>
var app = angular.module("app",[])
app.controller("ctrl",["$scope","$log",function($scope,$log){
  $scope.xxx = 'hello';
}])
</script>

<script>
  setTimeout(function(){
    $("#myapp").scope().xxx='gotcha!!! HAHA!';
    $("#myapp").scope().$digest();
  },0)
</script>

answered Feb 25, 2015 at 17:18

simon

5264 silver badges8 bronze badges

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

2 Comments

wbdlc Over a year ago

Thanks @simon, this passes to the 001 $rootScope, there is a nested 002 frontEnd scope also, it needs to be passed into that.

simon Over a year ago

Bit hard to figure out without seeing your code. Can you post a bare bones version?

Razvan Dumitru · Accepted Answer · 2015-02-25 16:49:30Z

0

window.property = $('#input_3').val();

$scope.input3val = window.property;

answered Feb 25, 2015 at 16:49

Razvan Dumitru

12.5k5 gold badges38 silver badges55 bronze badges

9 Comments

charlietfl Over a year ago

why do you need to pollute global namespace to do this?

Razvan Dumitru Over a year ago

if you use jquery with angular there is no way to pass 'variables' without polluting global namespace, or at least i don't know how

Razvan Dumitru Over a year ago

Please tell me how to do this without polluting global namespace or dom, i'm really interested. [i don't allow hidden inputs or other hacks like this as a response]

charlietfl Over a year ago

best way is run jQuery code inside a directive so you have scope access. Very hard to know what OP needs though without seeing any code

charlietfl Over a year ago

no idea how you got that all figured out from a one sentence question and no code

|

Steve Mitcham · Accepted Answer · 2015-02-25 17:22:43Z

0

The method $location.search() will get you access to the query string of the url as a JSON object. From the docs:

// given url http://example.com/#/some/path?foo=bar&baz=xoxo
var searchObject = $location.search();
// => {foo: 'bar', baz: 'xoxo'}

you can add $location to a controller through the dependencies

var app = angular.module("app",[])
app.controller("myController",["$scope, $location",function($scope, $location) {
   $scope.query = $location.search();
});

In your view template, you should then be able to use the query property to configure your jQuery calls.

answered Feb 25, 2015 at 17:22

Steve Mitcham

5,3131 gold badge31 silver badges56 bronze badges

Collectives™ on Stack Overflow

How to pass a variable from jQuery to Angular property

3 Answers 3

2 Comments

9 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related