Angular 2 - 要在 ag-grid 中显示的 JSON.stringify() 对象

Question

我有 ag-grid，从服务中我得到了在网格中显示的数据，如下所示：

我的 ts 代码如下所示：

constructor( private codeService: CodeService ) {
        this.columnDefs = [
                 { headerName: "Name", field: "name"},
                 { headerName: "Property", field: "properties", editable: true },
                            ];
    }

    ngOnInit() {
        this.codeService.getCodeType( this.name ).subscribe(
                response => { this.handleSuccess( response ); },
                error => { console.error( error ); });

    }

    handleSuccess( aaTypes ) {
        var data = [];
        aaTypes.forEach( ( aaType ) => {
            var entriesForType = [];
            entriesForType.push( aaType );    
                if ( entriesForType.length > 0 ) {
                    entriesForType.forEach( entry => data.push( entry ) );
                    this.data = data;
                    if(this.gridOptions.api !== null){
                        this.gridOptions.api.setRowData( data );
                    }
                } 
        });
    }

如您所见...属性实际上是对象，它在图一的网格中显示...我的问题是，我有什么办法可以将 "properties" 字符串化，这样它就可以显示为字符串而不是对象。如果它显示类似“{location: 0, color; 255}”的内容，我没问题。

Answer 1

将 valueFormatter 添加到您的 columnDefs 并创建格式化程序：

constructor( private codeService: CodeService ) {
    this.columnDefs = [
             { headerName: "Name", field: "name"},
             { headerName: "Property", field: "properties", valueFormatter: jsonFormatter, editable: true },
                        ];
}

function jsonFormatter(d) {
     return JSON.stringify(d);
}

Angular 2 - 要在 ag-grid 中显示的 JSON.stringify() 对象

Angular 2 - JSON.stringify() object to show in ag-grid

json

angular

object

stringify