CODEWITHSUNDEEP
angularjs
Mou
Mou

Reputation: 16282

AngularJS What is the order of firing directives

I just tried to make something with two directives but I do not understand why my welcome directive is firing first.

It doesn't seem to matter if I have my element defined like this <div goodbye welcome></div> or this <div welcome goodbye></div>. Either way the welcome directive is always firing first.

<body ng-app="greetings">
    <div  goodbye welcome></div>
</body>

angular.module('greetings', [])
.directive("goodbye", function() {
  return {
    restrict: "A",
    link: function(){
      alert("See ya later!");
    }
  }
})
.directive("welcome", function() {
  return {
    restrict: "A",
    link: function(){
      alert("Howdy!");
    }
  }
});

What do I need to change in code above to have it such that the goodbye directive fires first?

Upvotes: 0

Views: 55

Answers (1)

MBN
MBN

Reputation: 1006

You must define a priority on your directives:

<body ng-app="greetings">
    <div  goodbye welcome></div>
</body>

angular.module('greetings', [])
.directive("goodbye", function() {
  return {
    restrict: "A",
    priority: 1,
    link: function(){
      alert("See ya later!");
    }
  }
})
.directive("welcome", function() {
  return {
    restrict: "A",
    priority: 2,
    link: function(){
      alert("Howdy!");
    }
  }
});

Upvotes: 1

Related Questions