Find child element in AngularJS directive
angularjs, angularjs-directive, javascript
Solution
jQlite (angular's "jQuery" port) doesn't support lookup by classes.
One solution would be to include jQuery in your app.
Another is using `QuerySelector` or `QuerySelectorAll`:
link: function(scope, element, attrs) {
console.log(element[0].querySelector('.list-scrollable'))
}
We use the first item in the `element` array, which is the HTML element. `element.eq(0)` would yield the same.
FIDDLE
Problem
I am working in a directive and I am having problems using the parameter `element` to find its childs by class name. ``` .directive("ngScrollList", function(){ return { restrict: 'AE', link: function($scope, element, attrs, controller) { var scrollable = element.find('div.list-scrollable'); ... } }; }) ``` I can find it by the tag name but it fails to find it by class name as I can see in the console: ``` element.find('div') [<div class="list-viewport">…</div>,<div class="list-scrollable">…</div>] element.find('div.list-scrollable') [] ``` Which would be the right way of doing such thing? I know I can add jQuery, but I was wondering if wouldn't that be an overkill....