Get Attributes of Element in AngularJS Just Like jQuery

Introduction

jQuery provides the very good feature that when you have created any kind of click/keyup/keydown and so on event then you can find all the attributes of that element in that function using the "this" keyword. But jQuery doesn't provide such kind of functionality (as far as I know, it might be possible that I am wrong). So, I was trying to access the attributes of an element in the angular code. Then I came to understand that we can access them, but with some small functionality. So, here I am explaining that trick/functionality to get the attributes.

Step 1

First of all I have created a HTML page that will help us to understand this article in a very simple way.

Here I bound the controller to a div, this controller is not yet created but I provided this name in the HTML and I'll provide it in the Angular code as well.

In this div I took a simple HTML element that is of input type and added some attributes to this element, like "name", "id" and so on.

On the keyup of this element I called the function named "showAttributes", in this function I am sending the $event as parameter. This parameter will help us to access the attributes.

Step 2

After this I created a JavaScript file where we will write the AngularJs code.

On this JavaScript file I had code something like this:

Here I have created a controller with the name "AngularController".

In this controller I created a function named "showAttributes". That is the function to be called on the keyup. The parameter of this function will help in accessing the attributes.