How can I grab an element's attr data in angular with jqlite?

Question

How can I grab an element's attr data in angular with jqlite?

html,

<button ng-click="loadForm($event)" href="form.php">Load Directive Form</button>
<div data-my-form></div>

angular,

     app.directive('myForm', function() {
        return {
          controller:function($scope){
            $scope.isLoaded = false;
            $scope.loadForm = function(e){

                console.log(e.target.attr('href')); // error 

                var form = e.target.attr('href'); // error

                $scope.isLoaded = true;
            }
          },
          template: '<div><div ng-if="isLoaded" ng-include="'+ form +'" ></div></div>',
          link:function(scope, element) {

          }
        }
    });

I get this error,

TypeError: e.target.attr is not a function

any ideas?

Answer 1

attr() is method available on jqLite elements.

e.target is a reference to a DOM element.

You need to wrap the DOM element as a jqLite element first:

var form = angular.element(e.target).attr('href');