要在Angular 8中使用primeNG表格,并将所有单元格设置为可编辑,可以按照以下步骤进行操作:
npm install primeng --save
npm install primeicons --save
app.module.ts
文件中导入所需的模块:import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { TableModule } from 'primeng/table';
@NgModule({
declarations: [
// ...
],
imports: [
BrowserModule,
FormsModule,
TableModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Column 1
Column 2
Column 3
{{rowData[col.field]}}
import { Component } from '@angular/core';
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.css']
})
export class ExampleComponent {
data: any[];
columns: any[];
constructor() {
this.data = [
{ col1: 'Value 1', col2: 'Value 2', col3: 'Value 3' },
{ col1: 'Value 4', col2: 'Value 5', col3: 'Value 6' },
// ...
];
this.columns = [
{ field: 'col1', header: 'Column 1' },
{ field: 'col2', header: 'Column 2' },
{ field: 'col3', header: 'Column 3' },
];
}
}
这样,使用primeNG表格时,所有单元格都将可编辑。您可以根据需要进行修改和定制。