如何将没有标题的字符串数组绑定到ag-grid?

时间:2019-04-22 08:43:44

标签: angular ag-grid

我正在使用Ag-grid,但无法将数据绑定到网格。似乎网格引用了我的数据(我在网格中看到5行),但是缺少文本 数据通过放置请求发送到服务器,响应为:

  

[“ CPJ4_OPC_IOs_Station_1_AsiD_Input_AsidDriveActiveHW”,   “ CPJ4_OPC_IOs_Station_4_Ink_1_Input_General_ITS_Sens_InPlace”,   “ CPJ4_OPC_IOs_Station_4_Ink_1_Output_Pump_InkBidReturnPump”,   “ CPJ4_OPC_IOs_WaterSys_Input_TankTemperature”,   “ CPJ4_OPC_IOs_WaterSys_Output_WaterBypassValve”]

当我打印到控制台时,网格本身缺少网格[p],它具有以上响应[p]

例如,如果我设置了网格中的某一行,则会从控制台看到错误,该错误指向带有文本的值。例如:

ERROR TypeError: Cannot create property 'InputOutput' on string 'CPJ4_OPC_IOs_Station_4_Ink_1_Output_Pump_InkBidReturnPump'
    at ValueService.webpackJsonp.../../../../ag-grid/dist/lib/valueService/valueService.js.ValueService.setValueUsingField (valueService.js:155)
    at ValueService.webpackJsonp.../../../../ag-grid/dist/lib/valueService/valueService.js.ValueService.setValue (valueService.js:112)

parameter.model.ts:

class Parameter{

InputOutput: string;}

parameter.service.ts

private apiUrl = 'http://localhost:8400/api/Managers/Manager/Press.Tools.Development.Server.Engine.IIOEditorManager/GetIOs';


constructor(private http: Http) {
}

findAll(): Observable<Parameter[]> {

    let myHeaders = new Headers();
myHeaders.append("Content-Type" , "application/json-patch+json");    

//let options = new RequestOptions({ headers: {  }, params: [] });


    return this.http.put(this.apiUrl, '{            "additionalProp1": {},            "additionalProp2": {},            "additionalProp3": {}          }'
                    , { headers : myHeaders })
        .map((res: Response) => res.json())
        .catch((error: any) => Observable.throw(error.json().error || 'Server error'));
}

grid.component.ts

@Component({
selector: 'app-grid',
templateUrl: './grid.component.html',
styleUrls: ['./grid.component.css']
       })
export class GridComponent implements OnInit {
// row data and column definitions
private rowData2: Parameter[] = [];
private columnDefs: ColDef[];

// gridApi and columnApi
private api: GridApi;
private columnApi: ColumnApi;
private searchValue;
private inputVar;

// inject the ParameterService
constructor(private parameterService: ParameterService, private 
 chatService: ChatService) {
    this.columnDefs = this.createColumnDefs();
    this.inputVar = "";
}

// on init, subscribe to the parameter data
ngOnInit() {
    this.chatService.messages.subscribe(msg => {            
        console.log("Response from websocket: " + msg);
});
    this.parameterService.findAll().subscribe(
        parameter => {
            this.rowData2 = parameter
            console.log(parameter);

        },
        error => {
            console.log(error);
        }
    )        
}

// one grid initialisation, grap the APIs and auto resize the columns to 
 fit the available space
onGridReady(params): void {
    this.api = params.api;
    this.columnApi = params.columnApi;
    this.api.sizeColumnsToFit();


}

// create  column definitions
private createColumnDefs() {
    return [
        {headerName: 'Parameters', field: 'InputOutput',  width: 300, 
editable:true
 }

    ]
}

//set quick filter on the left table
quickSearch()
{
    this.api.setQuickFilter(this.searchValue);
}

// write to console the new value that user insert
 changeInputVar(): void {
    console.log(this.inputVar);

  }

// rollback value and update the text box in the UI
restoreInputVar(): void {
    this.inputVar = "";
  }

}

grid.component.html

 <input type = "text" placeholder="Search for Witkin's parameters" (keyup) 
 = "quickSearch()" [(ngModel)] = "searchValue"  size="90"><br>

  <ag-grid-angular style="width: 35%; height: 1000px;"
  [gridOptions]="gridOptions" 
             class="ag-fresh"
             (gridReady)="onGridReady($event)"
             [enableSorting]="true"
             [columnDefs]="columnDefs"
             [rowData]="rowData2">
    ></ag-grid-angular>

它没有解决,更改了参数类型和可观察类型。 我仍然看不到网格中的文本,也许是因为响应中没有标题吗?

有人可以帮我做错什么吗?

0 个答案:

没有答案