2017-07-31 13 views
0

編集可能なグリッドが必要ですが、私たちはprimeng datatableを使用することに決めました。Angular2- formControlNameを持つ編集可能なグリッド

これを達成するために、以下のコードを使用していますが、期待どおりに機能していません。私は問題がformControlNameと思うが、私は何が問題であるか分からない。

<p-dataTable [value]="lstchecklistModel" [responsive]="true" [editable]="true" [style]="{'margin-top':'50px'}">      
       <p-column field="labelName" header="Checklist"></p-column>      
       <p-column field="required" header="Required" [editable]="true" [style]="{'overflow':'visible'}"> 
        <ng-template let-col let-car="rowData" pTemplate="editor"> 
         <p-dropdown formControlName="required" dataKey="label" [options]="RequiredValues" [autoWidth]="false" [style]="{'width':'100%'}" required="true"></p-dropdown> 
        </ng-template> 
       </p-column> 
       <p-column field="required" header="Mail Received Date"></p-column> 
       <p-column field="received" header="Recived?"></p-column> 
       <p-column field="receivedDate" header="Mail Received Date"></p-column> 
       <p-column field="mailReceivedDate" header="Mail Received Date"></p-column> 
       <p-column field="updatedBy" header="Updated By"></p-column> 
      </p-dataTable> 

私は以下の変更でこれを達成することができたおかげで、 パニ

答えて

0

<p-dataTable [value]="lstchecklistModel" [responsive]="true" [editable]="true" [style]="{'margin-top':'50px'}"> 
        <p-column field="labelName" header="Checklist" [style]="{'overflow':'visible', 'width':'300px'}"></p-column> 
        <p-column field="required" header="Required?" [editable]="true" [style]="{'overflow':'visible', 'width':'100px'}"> 
         <ng-template let-col let-row="rowData" pTemplate="editor"> 
          <p-dropdown [(ngModel)]="row[col.field]" [ngModelOptions]="{standalone: true}" [options]="RequiredValues" [autoWidth]="false" [style]="{'width':'100%'}"></p-dropdown> 
         </ng-template> 
        </p-column> 
        <p-column field="received" header="Recived?" [editable]="true" [style]="{'overflow':'visible', 'width':'100px'}"> 
         <ng-template let-col let-row="rowData" pTemplate="editor"> 
          <p-dropdown [(ngModel)]="row[col.field]" [ngModelOptions]="{standalone: true}" dataKey="label" [options]="RequiredValues" [autoWidth]="false" [style]="{'width':'100%'}" ></p-dropdown> 
         </ng-template> 
        </p-column> 
        <p-column field="receivedDate" header="Mail Received Date"></p-column> 
        <p-column field="mailReceivedDate" header="Mail Received Date"></p-column> 
        <p-column field="updatedBy" header="Updated By"></p-column> 
       </p-dataTable> 
関連する問題