PrimeNG datatable 편집 할 수 없습니다

Question

안녕하세요 저는 datatable에 대한 primeNG를 사용하려고하지만 출력은 적용된 속성이없는 기본 테이블 일뿐입니다. 구성 요소 :

import { Component } from '@angular/core'; 
import {AccordionModule} from 'primeng/primeng';  //accordion and accordion tab 
import {MenuItem} from 'primeng/primeng'; 
import {DataTableModule} from 'primeng/components/datatable/datatable'; 
import {SharedModule} from 'primeng/primeng'; 
import { sampleProducts } from './products'; 

@Component({ 
    selector: 'data-grid', 
    templateUrl: './data-grid.html' 
}) 
export class DataGridComponent { 
    private data: any[] = sampleProducts; 
} 

템플릿 :

이

<p-dataTable [value]="data" [editable]="true"> 
<p-column field="PayScaleArea" header="PayScaleArea"></p-column> 
<p-column field="PayScaleTypeCode" header="PayScaleTypeCode" [sortable]="true"></p-column> 
<p-column field="MeritPercentage" header="MeritPercentage" [sortable]="true"></p-column> 
<p-column field="CreatedBy" header="CreatedBy"></p-column> 
<p-column field="CreatedDate" header="CreatedDate"></p-column> 

app.module :

import { NgModule } from '@angular/core'; 
import {FormsModule} from '@angular/forms'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
import { AppComponent } from './app.component'; 
import {AccordionModule} from 'primeng/primeng';  //accordion and accordion tab 
import {MenuItem} from 'primeng/primeng'; 
import {DataTableModule} from 'primeng/components/datatable/datatable'; 
import {SharedModule} from 'primeng/primeng'; 
import { DataGridComponent } from './data-grid.component'; 


@NgModule({ 
    bootstrap: [AppComponent], 
    declarations: [AppComponent,DataGridComponent], 
    imports:  [BrowserModule, BrowserAnimationsModule, AccordionModule,DataTableModule,SharedModule] 
}) 
export class AppModule { 
} 

출력 : 은 일반 테이블처럼 보인다. 설정에 누락 된 항목이 있습니까?

Answer 1

열을 편집 가능으로 설정 했습니까? like :

<p-column field="PayScaleArea" header="PayScaleArea" [editable]="true"></p-column> 

Answer 2

그래도 문제가 남아 있습니까? 난 그냥 각 p-column에 대한 [editable]="true"을 추가 곳

나는 코드이 Plunker을 생성하고 모든 그것은, (정렬 및 편집 데이터)를 확인하여야한다 보인다?

<p-dataTable [value]="data" [editable]="true"> 
    <p-column field="PayScaleArea" header="PayScaleArea" [editable]="true"></p-column> 
    <p-column field="PayScaleTypeCode" header="PayScaleTypeCode" [sortable]="true" [editable]="true"></p-column> 
    <p-column field="MeritPercentage" header="MeritPercentage" [sortable]="true" [editable]="true"></p-column> 
    <p-column field="CreatedBy" header="CreatedBy" [editable]="true"></p-column> 
    <p-column field="CreatedDate" header="CreatedDate" [editable]="true"></p-column> 
</p-dataTable>