AngularJS: How to get a DOM element by id

Question

Sample

Please consider this Plunkr.

What I need

I need to be able to get an element by it's id.

The sample code should be able to assign a css class to any DOM element that exists on the current view.

This should be checked using a source object, provided by the $scope in a controller. This source object may/will have more properties than there are input elements on the view.

So I want to loop through each object key and see if a corresponding DOM element exists. If so, validate it's value.

The question

How do I get an element by id, using AngularJS only (jQuery is NOT allowed!!)?

Specifically for the Plunkr, I need this function to (really) work:

self.IsFieldCurrentlyActive = function(field){
  // Should be (in pseudocode):
  // var inputElement = angular.find(field);
  // return (inputElement != 'undefined');

  // Sample only
  var idx = field.indexOf('Unused');
  return idx == -1;
};

And this one (basically the same):

self.GetElementByKey = function(key)
{
  // Should be (in pseudocode):
  // var inputElement = angular.find(field);
  // return inputElement;

  // Sample only
  return null;
}

Update

Apologies, I forgot to add an important requirement: I can't use any mechanism that assumes unique IDs, because there may be multiple occurrences of the same form (and the same IDs). So, I need to respect the Angular scope.

Thanks!

Answer 1

In pure JS you can do document.querySelector('#myID');

Or within angular using angular.element: angular.element(document.querySelector('#myID'));

Answer 2

Instead try angular.element($('#myElement'));