Skip to content
Closed
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 10 additions & 10 deletions Document-Processing/Excel/Spreadsheet/Angular/data-binding.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,13 +29,13 @@ Refer to the following code example for local data binding.
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/local-data-binding-cs1" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/local-data-binding-cs1/" %}

> The local data source can also be provided as an instance of the [`DataManager`](https://helpej2.syncfusion.com/angular/documentation/data/). By default, [`DataManager`](https://helpej2.syncfusion.com/angular/documentation/data/) uses [`JsonAdaptor`](https://ej2.syncfusion.com/angular/documentation/data/adaptors#json-adaptor) for local data-binding.

### Customizing column data mapping

By default, when a data source is bound to a sheet, columns are auto-assigned from the data source fields sequentially. This means that the first field in the data source is assigned to Column A, the second to Column B, and so on, sequentially. However, now you can customize the column assignments by specifying the appropriate field names in the desired order using the [fieldsOrder](https://ej2.syncfusion.com/angular/documentation/api/spreadsheet/rangeModel/#fieldsorder) property.
By default, when a data source is bound to a sheet, columns are auto-assigned from the data source fields sequentially. This means that the first field in the data source is assigned to Column A, the second to Column B, and so on, sequentially. However, now you can customize the column assignments by specifying the appropriate field names in the desired order using the [fieldsOrder](https://ej2.syncfusion.com/angular/documentation/api/spreadsheet/rangemodel/#fieldsorder) property.

> You can customize the mapping of column data only in the local data binding support.

Expand All @@ -51,11 +51,11 @@ The following code example demonstrates how to customize the mapping of column d
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/field-mapping-cs1" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/field-mapping-cs1/" %}

## Remote data

To bind remote data to the Spreadsheet control, assign service data as an instance of [`DataManager`](https://helpej2.syncfusion.com/angular/documentation/data/) to the `dataSource` property. To interact with remote data source, provide the service endpoint `url`.
To bind remote data to the Spreadsheet control, assign service data as an instance of [`DataManager`](https://ej2.syncfusion.com/angular/documentation/data/getting-started) to the `dataSource` property. To interact with remote data source, provide the service endpoint `url`.

Refer to the following code example for remote data binding.

Expand All @@ -69,7 +69,7 @@ Refer to the following code example for remote data binding.
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs1" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs1/" %}

> By default, `DataManager` uses **ODataAdaptor** for remote data-binding.

Expand All @@ -87,7 +87,7 @@ Refer to the following code example for remote data binding.
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs2" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs2/" %}

### Web API

Expand All @@ -103,7 +103,7 @@ You can use WebApiAdaptor to bind spreadsheet with Web API created using OData e
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs3" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/remote-data-binding-cs3/" %}

## Cell data binding

Expand All @@ -121,7 +121,7 @@ Refer to the following code example for cell data binding.
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/cell-data-binding-cs1" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/cell-data-binding-cs1/" %}

> The cell data binding also supports formula, style, number format, and more.

Expand Down Expand Up @@ -151,7 +151,7 @@ The following table defines the arguments of the `dataSourceChanged` event.
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/dynamic-data-binding-cs1" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/dynamic-data-binding-cs1/" %}

## Dynamic data binding using updateRange method

Expand All @@ -171,7 +171,7 @@ The following code example demonstrates how to dynamically update data using the
{% endhighlight %}
{% endtabs %}

{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/dynamic-data-binding-cs2" %}
{% previewsample "https://helpstaging.syncfusion.com/document-processing/samples/excel/spreadsheet/angular/dynamic-data-binding-cs2/" %}

## Note

Expand Down