title: How to make a single Primeng DataTable row editable on a button click using in Angular 2
body: <p>I am trying to use DataTable from Primeng in Angular 2.</p>
  
  <p>I am displaying set of rows in datatable having a column for Edit button.</p>
  
  <p>On click of edit button of any row, all fields of that row should be editable.</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code> &lt;p-dataTable [value]="testcases" [(selection)]="selectedTestCases" dataKey="ModuleID" [editable]="true" sortMode="multiple"&gt;
           &lt;p-column [style]="{'width':'10 px'}" selectionMode="multiple"&gt;&lt;/p-column&gt;
          &lt;p-column field="ModuleID" [editable]="isEditable" header="ModuleID"&gt;&lt;/p-column&gt;
          &lt;p-column field="TestCaseID" [editable]="isEditable" header="TestCaseID"&gt;&lt;/p-column&gt;
          &lt;p-column field="EstimatedTime" [editable]="isEditable" header="EstimatedTime"&gt;&lt;/p-column&gt;
            &lt;p-column field="isEditable"  header="Edit" [editable]="isEditable"&gt;
                  &lt;ng-template let-col let-row="rowData" let-index="rowIndex"  pTemplate="body" &gt;
                      &lt;span&gt;
                          &lt;input type="button" value="Edit" (click)="edit(row,index)" /&gt; 
                      &lt;/span&gt;
                  &lt;/ng-template&gt;
  
            &lt;/p-column&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>Angular Component:</strong></p>
  
  <pre><code>edit(rowdata:TestCases,index:number) {
  
  this.selectedTestCases=rowdata
  rowdata.isEditable=true;
   }
  </code></pre>
  
  <p>With this code, property of that row is set to editable, but in UI fields are not editable.</p>
  
  <p>Am I doing anything wrong?</p>
  
  <p>Any help is appreciated.</p>