与Angular7具有多个响应的同步动态网格数据

Question

我正在尝试创建一个带有同步升级的网格，但是我必须进行两个API调用，并且我必须添加两个API响应的响应，然后使用Angular7使用SyncFusion填充数据。无法这样做。

请帮助我使用JSFIDDLE或任何工作样本。

我已经使用过：

npm install @syncfusion/ej2-angular-grids --save 
npm install @syncfusion/ej2 --save 

Answer 1

您可以通过更新网格datasource将API响应绑定到网格中。请请参阅下面的示例，以订于Angular7中的两个API调用的绑定网格数据，我们已经使用了 ajax在中创建事件以达到您的要求。

[html]

<ejs-grid [dataSource]='data' (created)='created($event)' height='350'>
    <e-columns>
        <e-column field='OrderID' headerText='Order ID' width='120' textAlign='Right'></e-column>
        <e-column field='CustomerID' headerText='Customer Name' width='150'></e-column>
        <e-column field='ShipCity' headerText='Ship Country' width='150'></e-column>
    </e-columns>
</ejs-grid>

[ts]

created(args){
let ajax = new Ajax();
ajax.type = 'Get';
ajax.url = 'https://ej2services.syncfusion.com/production/web-services/api/Orders';
ajax.send();
ajax.onSuccess = (args) => {
  this.data = JSON.parse(args);
};
let ajax2 = new Ajax();
ajax2.type = 'Get';
ajax2.url = 'https://ej2services.syncfusion.com/production/web-services/api/Orders';
ajax2.send();
ajax2.onSuccess = (args) => {
  this.data = [...this.data , ...JSON.parse(args)];
}

请参阅以下示例和文档以获取更多信息，

样本

文档：创建，ajax