title: Data binding issue with Angular JS and Bootstrap Modal
body: <p>I am unable to change scope values using angular js when using bootstrap modal. Basically I am calling function to open modal that I store in controller.js file and then I am trying to amend scope values and display them in modal dialog box.</p>
  
  <p>I added click event to one of my js components. </p>
  
  <pre><code>eventClick: function(event, element) {
      var $scope = angular.element("#eRotaController").scope();
      $scope.OpenModal("addEventModal", false, event);
  }
  </code></pre>
  
  <p>Part of html element (modal dialog):</p>
  
  <pre><code>&lt;div class="modal-header"&gt;
      &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;
      &lt;h4 class="modal-title"&gt;{{misc.modalTitles}}&lt;/h4&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Finally OpenModal function and variables</p>
  
  <pre><code>// Variables
  $scope.misc = {
      modalTitle: "",
      showRemoveEvent : false
  };
  
  $scope.OpenModal = function (modal, isNew, event)
  {
      if (isNew) {
          $scope.misc.modalTitle = "Add new Event";
      }
      else{
          $scope.misc.modalTitle = "Update event for: " + event.title;
          $scope.misc.showRemoveEvent = true;
          console.log($scope);
      }
  
      $("#" + modal).modal('show');
  }
  </code></pre>
  
  <p>When I update modalTitle for instance inside OpenModal function it does not reflect any changes when opening modal.</p>
  
  <p>I created simpler example to find out if it's modal issue and turns out it's not.</p>
  
  <p>Quick test that I have added :</p>
  
  <pre><code>&lt;button ng-click="OpenModal2()"&gt;&lt;/button&gt;
  {{misc.showRemoveEvent}}
  
  
  $scope.OpenModal2 = function()
  {
      $scope.misc.modalTitle = "Update event for: " + event.title;
      $scope.misc.showRemoveEvent = true;
  }
  </code></pre>
  
  <p><strong>That works fine.</strong> </p>
  
  <p>So it works correctly when method is called directly from html element but fail when called from js using reference to controller :</p>
  
  <pre><code> var $scope = angular.element("#eRotaController").scope();
  
   $scope.OpenModal("addEventModal", false, event);
  </code></pre>
  
  <p><strong>Does not work</strong></p>