Link function not getting run in AngularJS directive

Question

I'm having trouble with an angular directive. It doesn't seem to run the link function.

I feel like it's something obvious, but I just can't figure it out.

The directive is required as seen from below

angular.module('test').requires // ["injectedModule"]

Code below. Fiddle.

Any help would be amazing.

angular
    .module('test', ['injectedModule'])
    .controller('tester', [
        function() {
            this.test = function(data) {
                alert(data);
            }
        }
    ]);

angular
    .module('injectedModule', [])
    .directive('testing', [
      function() {
        return {
          restrict: 'E',
          scope: true,
          link: function(scope, element, attrs) {
            alert(scope, element, attrs);
          }
        };
      }
    ]);

<div ng-app="test">
    <div ng-controller="tester as t">
         <video id="test" ng-src="https://scontent.cdninstagram.com/hphotos-xfa1/t50.2886-16/11726387_1613973172221601_1804343601_n.mp4" testing="t.test(el)" />        
    </div>
</div>

isherwood · Accepted Answer · 2015-07-09 19:59:49Z

3

Looks to me like

restrict: 'E',

should be

restrict: 'A',

Your directive isn't being called at all as it is.

answered Jul 9, 2015 at 19:59

isherwood

61.4k16 gold badges122 silver badges173 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

LucaApo · Accepted Answer · 2015-07-09 20:08:36Z

1

I think the error is in the restriction you are giving to your directive. You are restricting your directive to match only element (in other words tag). You should restrict to match attribute 'A'. Here's angular official documentation https://docs.angularjs.org/guide/directive and here's your fiddle working

Code sample:

angular
.module('injectedModule', [])
.directive('testing', [
  function() {
    return {
      restrict: 'A',
      scope: true,
      link: function(scope, element, attrs) {
        alert(scope, element, attrs);
      }
    };
  }
]);

answered Jul 9, 2015 at 20:08

LucaApo

741 silver badge3 bronze badges

Collectives™ on Stack Overflow

Link function not getting run in AngularJS directive

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related