title: How do I make angular-ui cell editable on single click?
body: <p>I am trying to make <code>angular ui-grid cell editable (row)</code> cell editable on <code>single click.</code></p>
  
  <p>Right Now, Cell becomes editable on double click.</p>
  
  <p>How do I make cell editable on single click?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="grid testGrid" ui-grid="testGridOptions" ui-grid-edit 
       ui-grid-row-edit style="width: 100%;"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>var columns = [
      { field: 'Name', displayName: 'Name', cellEditableCondition: function ($scope) { return $scope.row.entity.showRemoved; } }
  ];
  </code></pre>
  
  <p>Grid options:</p>
  
  <pre><code>$scope.testGridOptions = {
      enableRowSelection: false,
      enableRowHeaderSelection: false,
      enableCellEdit: true,
      enableCellEditOnFocus: false,
      enableSorting: false,
      enableFiltering: false,
      multiSelect: false,
      rowHeight: 30,
      enableColumnMenus: false,
      enableGridMenu: false,
      showGridFooter: false,
  
      onRegisterApi: function (gridApi) {
          $scope.gridApi = gridApi;
      }
  };
  </code></pre>