title: Controller not called the second time in ionic app
body: <p>In one of my apps built using Ionic framework, I have a few template files that are used to display content on click of the 'Next' button. However, on certain instances I want to use the same template but with different data (-else part of the if-else condition in the below js code). The template displays the correct data the very first time it is loaded. However the next I hit the 'next' button, there is no call that is made to the controller(AerodynamicCtrl) and I am getting the same data (if part of the condition) again. Also I read about ion-view but I have not used it for my code. Could someone please help me and suggest what I am doing wrong here? Thanks in advance.</p>
  
  <p>my code below -</p>
  
  <p>html code - index.html</p>
  
  <pre><code>&lt;ion-content&gt;
   &lt;div class="list card"&gt;
      &lt;div data-id='{{q_no}}' class="item item-divider custom-question-title"&gt;
          {{question_info.text}}
      &lt;/div&gt;
      &lt;div data-ng-include="getQuestionTemplate()"&gt;&lt;/div&gt;
   &lt;/div&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>getQuestionTemplate() in the above code snippet fetches my template based on some condition and renders the below file</p>
  
  <p>templates/ion-aero.html</p>
  
  <pre><code>&lt;div data-ng-controller="AerodynamicCtrl" class="spritespin" ng-init="init_aerodynamic_activity()"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>JS code</p>
  
  <pre><code>app.controller("AerodynamicCtrl", ["$scope", "$localStorage", "$fileLogger", AerodynamicCtrl]);
  
  function AerodynamicCtrl($scope, $localStorage, $fileLogger){
  
      $scope.init_aerodynamic_activity = function(){
  
          if($scope.question_info.category == 1){
              $('.spritespin').spritespin({
                  // generate an array of image urls. This is a helper function that takes a {frame} placeholder
                  source: SpriteSpin.sourceArray('img/aero/{frame}.png', {
                      frame: [1,52] // this ramge of numbers is interpolated into the {frame} placeholder
                  }),
                  width: 480, // Specify the display width and height of the frame. // Optionally the size of the container can be defined with CSS.
                  height: 327,
                  responsive: true
              });
  
          } else {
              $('.spritespin').spritespin({
                  // source: 'lib/threesixty-slider/assets/panorama.jpg',
                  source: 'img/aero/panorama.jpg',
                  width: 600, // this sets the width of the display. The panorama image must be larger than the below width
                  height: 300,
                  // select the modules
                  mods: [
                      'drag',  // change frame on mouse drag
                      'ease',  // enable the easing module. this will ease out the animation after mouse release, instead of a hard stop
                      'panorama' // the panorama display module
                  ]
              });
          }
      }
  }
  </code></pre>