alexandernst alexandernst - 1 year ago 83
Javascript Question

.parents() in Angular?

Is there a way I could emulate jQuery's

method in Angular, without having to actually include jQuery?

The final goal is to get all the parents of a DOM element.

EDIT: Why I need this?

I'm creating a directive (a dropdown-like widget). The dropdown should listen the entire
for clicks and close itself (if it's open) if a click is made outside of the widget's area.

Now, I know how to create a simple directive that would listen for mouse events, like this one:

app.directive('mouseTrap', function() {
return function(scope, elem) {
elem.bind('click', function(event) {
scope.$broadcast('click', { event: event } );

...which I would then use like this:
<body mouse-trap .... >

$scope.$on('click', function(msg, obj) {

That is where I need to check if any of the parents of the clicked object is the top-level div of my widget, and if not, close the widget.

Answer Source

EDIT: Although this answer was accepted, it's not correct. See comment and better answers below.

It does look like jQLite supports this already so if you're using angular you should be able to do this without pulling in JQuery itself.

From the docs here:

Supported instance methods: (links to jQuery Docs) A subset of the operations which jQuery supports are currently implemented. All of them are implemented using the chained operation syntax of jQuery. e.g:

$("").each(function() {


$(", div.baz").css({ "border": "1px solid red"    }).children().addClass("child");