How can I grab attr element data in angular using jqlite?

Question

How can I grab attr element data in angular using 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 a method available for jqLite elements.

e.target is a reference to a DOM element.

First you need to wrap the DOM element as a jqLite element:

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