如何讓使用在角2

使用數據表從Primeng我有編輯按鈕列顯示的行集數據表中點擊一個按鈕一個Primeng數據錶行編輯。

點擊任意行的編輯按鈕，該行的所有字段都應該是可編輯的。

HTML：

<p-dataTable [value]="testcases" [(selection)]="selectedTestCases" dataKey="ModuleID" [editable]="true" sortMode="multiple"> 
     <p-column [style]="{'width':'10 px'}" selectionMode="multiple"></p-column> 
     <p-column field="ModuleID" [editable]="isEditable" header="ModuleID"></p-column> 
     <p-column field="TestCaseID" [editable]="isEditable" header="TestCaseID"></p-column> 
     <p-column field="EstimatedTime" [editable]="isEditable" header="EstimatedTime"></p-column> 
      <p-column field="isEditable" header="Edit" [editable]="isEditable"> 
       <ng-template let-col let-row="rowData" let-index="rowIndex" pTemplate="body" > 
        <span> 
         <input type="button" value="Edit" (click)="edit(row,index)" /> 
        </span> 
       </ng-template> 

      </p-column>

角度成分：

edit(rowdata:TestCases,index:number) { 

this.selectedTestCases=rowdata 
rowdata.isEditable=true; 
}

有了這個代碼，該行的屬性被設置爲可編輯的，但是在UI字段不編輯。

我做錯了什麼？

任何幫助表示讚賞。

來源

2017-08-10 Dheeraj Kumar

我有一個類似的問題，並解決它在每個p列中使用2個div，一個用於顯示數據，如果該行不可編輯，另一個div如果該行可編輯。

就是這樣。

<p-column field="ModuleID" [editable]="isEditable" header="ModuleID"> 
    <ng-template let-row="rowData" pTemplate="body"> 
     <div *ngIf="!row.isEditable">{{row.ModuleID}}</div> 
     <div *ngIf="row.isEditable"> 
      <input type="text" [(ngModel)]="row.ModuleID"> 
     </div> 
    </ng-template> 
</p-column>

來源

2017-08-11 19:32:25 Tom

使用上rowClick這個函數來獲取點擊的行 -

 onRowSelectClick(e){ 
      console.log(e); 
      this.CloseAllEditable(); 
      e.data.isEditable=true; 
     } 
    CloseAllEditable(){ 
     for(let item of this.testcases){ 
      if(item.isEditable){ 
      item.isEditable = false; 
      } 
     } 
     } 

    <p-column field="EstimatedTime" header="EstimatedTime"> 
     <template let-col let-row="rowData" let-index="rowIndex" pTemplate="body"> 
      <span *ngIf="!row.isEditable">{{row.EstimatedTime}}</span> 
      <span *ngIf="row.isEditable"><input type="text" [(ngModel)]="row.EstimatedTime"></span> 
     </template> 
     </p-column>

來源

2017-09-15 20:19:13 Pre

如何讓使用在角2

回答

相關問題