Question

我正在尝试使用http.get以角度6将以下示例数据加载到jqgrid（free）。

[{"maker":"Toyota", "model":"Celica"},{ "maker": "Chrysler", "model":"Mondeo"}]

模型类

export class Model{ 
    maker : string
    model : string
}

组件：

...
@Component({...})
export class SampleComponent implements OnInit {
   private _sampleService;

  columnModel : any[];
  models : Model[];

  constructor(_sampleService : SampleService) {
        this._sampleService = _sampleService;
   }
   ngOnInit() {
      this.columnModel = [{ name: "maker" },{ name: "model" }]
      this.models = this._sampleService.getModelList().subscribe(models => this.models = models);
  }
  ngAfterViewInit() {
    (<any>jQuery("#grid")).jqGrid({
        colModel: this.columnModel,
        data: this.models
    });
  }
}

服务：

....
@Injectable()
export class SampleService{
 constructor(private http : HttpClient){}

 getModelList():Observable<Model[]>{
   return this.http.get<Model[]> 
  ("http://localhost:8090/myapp/getModel");
 }
}

如果执行以下操作，则可以在控制台中看到数据。

this.http.get("http://localhost:8090/ducksoup/getModel")
 .subscribe(data => {console.log(data)})

但是，它不在网格中呈现。有帮助吗？

Answer 1

在获取记录之后，您可以在OnInit方法内编写jqxGrid绑定代码，它将在datagrid上显示数据

使用http get将数据加载到角度为6的网格中

1 个答案: