title: How to trigger init of a controller when loading different template in a modal - angularJS
body: <p>I know there is <a href="http://angular-ui.github.io/bootstrap/versioned-docs/0.13.4/#/modal" rel="nofollow noreferrer">angular bootstarp modal</a> but for now I have a modal which is opened using <code>$('#msg-modal').modal();</code> </p>
  
  <p>I have created modal as :</p>
  
  <pre><code>&lt;div class="modal signUpContent fade" id="msg-modal" tabindex="-1" role="dialog"&gt;
  &lt;div class="modal-dialog" style="margin-top: 200px;"&gt;
      &lt;div class="modal-content" ng-style="modal_data.style.container"&gt;
          &lt;div class="modal-header" style="background: #0bb586;" ng-style="modal_data.style.header"&gt;
              &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt; &amp;times; &lt;/button&gt;
              &lt;h3 class="modal-title-site text-center"&gt; {{ modal_data.title }} &lt;/h3&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
              &lt;center ng-if="!(modal_data.template)"&gt;&lt;span compile="modal_data.msg"&gt;&lt;/span&gt;&lt;/center&gt;
              &lt;span ng-if="(modal_data.template)"&gt;
                  &lt;div ng-include="modal_data.template"&gt;&lt;/div&gt;
              &lt;/span&gt;
              &lt;hr&gt;
              &lt;center&gt;
                  &lt;a ng-style="modal_data.style.ok_btn" ng-click="buttonClick(modal_data.ok_btn.on_click)" class="btn btn-primary smooth-corner" ng-show="modal_data.ok_btn" ng-href="{{ modal_data.ok_btn.path }}" ng-bind="modal_data.ok_btn.name"&gt; &lt;/a&gt;
                  &lt;a ng-style="modal_data.style.cancel_btn" ng-click="buttonClick(modal_data.cancel_btn.on_click)" class="btn btn-primary smooth-corner" ng-show="modal_data.cancel_btn" ng-bind="modal_data.cancel_btn.name"&gt;&lt;/a&gt;
              &lt;/center&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>as you can see I have <code>&lt;div ng-include="modal_data.template"&gt;&lt;/div&gt;</code> which loads a template when passed to it. The issue is that if I assign a controller inside that <code>modal_data.template</code> , its init function is called only once. Next time the modal is shown, the init function is not triggered. </p>
  
  <p>Is there any way to fix this. I know the issue is basically because its closed via jquery as <code>$('#msg-modal').modal('hide');</code> , which actually hides the element but not close it</p>