title: Bind values to UI Bootstrap Modal
body: <p>I have a table with a view button, when view is clicked modal display but now I want to display certain data on the modal. I am using <em>.html</em> pages.</p>
  
  <p>I am not sure what am I missing here</p>
  
  <p><strong>html</strong></p>
  
  <pre><code>&lt;td&gt;
      &lt;span&gt;
          &lt;input class="btn btn-sm btn-dark" data-ng-click="launch('create',client)" type="button" value="view" /&gt;
      &lt;/span&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>This will luanch the modal</p>
  
  <p><strong>Modal</strong></p>
  
  <pre><code>&lt;div class="modal fade  in" ng-controller="dialogServiceTest"&gt;
  &lt;div class="modal ng-scope"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;h4 class="modal-title"&gt;
                      &lt;span class="glyphicon glyphicon-star"&gt;&lt;/span&gt; Client Details
                  &lt;/h4&gt;
              &lt;/div&gt;&lt;div class="modal-body"&gt;
                  &lt;ng-form name="nameDialog" novalidate="" role="form" class="ng-pristine ng-invalid ng-invalid-required"&gt;
                      &lt;div class="form-group input-group-lg" ng-class="{true: 'has-error'}[nameDialog.username.$dirty &amp;amp;&amp;amp; nameDialog.username.$invalid]"&gt;
                          &lt;label class="control-label" for="username"&gt;Name:&lt;/label&gt;
                          &lt;input type="text" name="username" id="username" ng-model="client.ClientName" ng-keyup="hitEnter($event)" required=""&gt;
                          &lt;span class="help-block"&gt;Enter your full name, first &amp;amp; last.&lt;/span&gt;
                      &lt;/div&gt;
                      &lt;div&gt;{{client.ClientName}}&lt;/div&gt;
                  &lt;/ng-form&gt;
              &lt;/div&gt;&lt;div class="modal-footer"&gt;
                  &lt;button type="button" class="btn btn-default" ng-click="cancel()"&gt;Cancel&lt;/button&gt;
                  &lt;button type="button" class="btn btn-primary" ng-click="save()" ng-disabled="(nameDialog.$dirty &amp;amp;&amp;amp; nameDialog.$invalid) || nameDialog.$pristine" disabled="disabled"&gt;Save&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>Angular</strong></p>
  
  <pre><code>angular.module('modalTest', ['ngRoute','ui.bootstrap', 'dialogs'])
  .controller('dialogServiceTest', function ($scope,$http, $rootScope, $timeout, $dialogs) {
      $scope.clients = []; //Array of client objetcs
      $scope.client = {}; //Single client object
  
      $scope.launch = function (which,client) {
          var dlg = null;
  
          alert(client.ClientName);
          dlg = $dialogs.create('/templates/Modal.html', 'whatsYourNameCtrl', {}, { key: false, back: 'static' });
          dlg.result.then(function () {
                  $scope.client.ClientName = client.ClientName;
       });
  })
  .run(['$templateCache', function ($templateCache) {
      $templateCache.put('/templates/Modal.html');
   }]);
  </code></pre>