title: Triggering a function inside of a controller using states "onEnter" function
body: <p>So my nav is using angular states. And whenever you click an item in the menu it triggers a function that changes the picture in the head, so that there is a different picture on each pages header. This works fine when someone starts on the home page of the site and navigates only through clicking, but when you input the url the function is not triggered. I am trying to use onEnter() to trigger it so I can drop the click and it will work in both situations, but it looks like I am having scope issues and could really use some guidance.</p>
  
  <pre><code>app.directive("mainNav", function() {
      return {
          restrict: "E",
          templateUrl: "js/main-nav.html",
          controller: function() {
          this.tab = tabbytab;
  
          this.isSet = function(checkTab) {
              return this.tab === checkTab;
          };
  
          this.setTab = function(activeTab) {
              tabbytab = activeTab;
              window.fbAsyncInit();
          };
          this.imageArray = navImages;
          //minus 1 because tabbytab starts at 1 and the array doesnt of course
          this.currentImage = navImages[(tabbytab - 1)].image;
          console.log(tabbytab);
          this.setImage = function(activeTab) {
              this.currentImage = this.imageArray[tabbytab].image;
          };
      },
      controllerAs: "tab"
  };
  });
  </code></pre>
  
  <p>And here is my state</p>
  
  <pre><code>.state('home', {
          url: "/home",
          templateUrl: "js/home.html",
          onEnter: function() {
            tab.setTab(1);
            console.log("on enter function triggered");
          }
      })
  </code></pre>