title: Bootstrap and angular - pass object to modal
body: <p>I create table using bootstrap and angular use object to display data. I want to open popup window to change object property by clicking row (and use angular binding in modal to work with object).
  So my issue that i doesn't understand how to pass object from table to modal.</p>
  
  <p>I found many examples with passing values and changing html on fly but in my case i want to use angular for binding and want to pass reference to object.</p>
  
  <p>Sample of table:</p>
  
  <pre><code>&lt;table class="table table-condensed table-bordered"&gt;
              &lt;thead&gt;...&lt;/thead&gt;
              &lt;tbody&gt;
              &lt;tr ng-repeat="property in properties" data-toggle="modal" data-id="property" data-target="#editPropertyModal"&gt;
                  &lt;td&gt;{{property.name}}&lt;td/&gt;
                  &lt;td&gt;{{property.value}}&lt;td/&gt;
                  &lt;td&gt;...&lt;td/&gt;
              &lt;/tr&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
  </code></pre>
  
  <p>So by clicking this row i want to open modal and pass there property object and use controls like input, combobox to bind values via angular.
  My sample of modal:</p>
  
  <pre><code>&lt;div class="modal fade" id="editPropertyModal" tabindex="-1" role="dialog" aria-labelledby="editPropertyModalLabel" aria-hidden="true"&gt;
  &lt;div class="modal-dialog"&gt;
      &lt;div class="modal-content"&gt;
          &lt;div class="modal-header"&gt;
              &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
              &lt;h4 class="modal-title" id="editPropertyModalLabel"&gt;Property details&lt;/h4&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
              {{currentProperty.name}} - {{currentProperty.value}}
          &lt;/div&gt;
          &lt;div class="modal-footer"&gt;
              &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;
              &lt;button type="button" class="btn btn-primary"&gt;Save changes&lt;/button&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>
  My try to pass property via javascript:</p>
  
  <pre><code>$(document).on("click", ".open-editPropertyModal", function (e) {
      e.preventDefault();
      var _self = $(this);
      var property = _self.data('id');
      $("#currentProperty").val(property);
  
      $(_self.attr('href')).modal('show');
  });
  </code></pre>
  
  <p>Doesn't work.</p>