16.4.0 • Published 2 years ago

odata-data-source v16.4.0

Weekly downloads
11
License
MIT
Repository
github
Last release
2 years ago

npm version

odata-data-source

Data source for material table and angular cdk table that can work with odata version 4 api. It supports sorting with MatSort and pagination with MatPaginator as well as per column filtering.

Demo

Online demo: https://stackblitz.com/edit/odata-data-source-v15

Demo with dynamic table: https://stackblitz.com/edit/dynamic-table-odata

The supported version of Angular Material will be indicated by the major version number of this library. Version 8.2.0 is for Angular Material ^8.0.0, version 9.3.0 is for ^9.0.0, while versions <1.2.0 should work for angular versions <8.0.0.

Getting started

1. Install odata-data-source:

npm install --save odata-data-source @angular/cdk odata-query

2. Import http client module:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';

import { AppComponent } from './app';

@NgModule({
  ...
  imports: [
    ...

    HttpClientModule
  ],
})
export class AppModule {}

4. Initialize ODataDataSource in your component with http client and resource path:

import { HttpClient } from '@angular/common/http';

constructor(private readonly httpClient: HttpClient) {}

@Component({
  selector: 'app',
  templateUrl: './app.component.html',
})
export class AppComponent {

  const resourcePath = 'https://services.odata.org/V4/OData/OData.svc/Products';
  this.dataSource = new ODataDataSource(this.httpClient, resourcePath);

}

5. Use the data source for material or cdk table with column templates matching data

<table cdk-table [dataSource]="dataSource">
    ...
</table>

Further info

API reference for odata-data-source

NameDescription
selectedFields: string[]Properties to select from the odata api
sort: MatSortInstance of the MatSort directive used by the table to control its sorting. Sort changes emitted by the MatSort will trigger a request to get data from the api.
paginator: MatPaginatorInstance of the MatPaginator component used by the table to control what page of the data is displayed. Page changes emitted by the MatPaginator will trigger a request to get data from the api.
filters: ODataFilter[]Array of filters that implement ODataFilter interface. Setting filters will trigger a request to get data from the api.
initialSort: string[]Sort that will be applied initialy, which will be overriden when manual sort is performed. Data can be sorted by multiple columns. Follow column name with 'desc' for descending order: 'columnName desc'.
expandedFields: string[] | objectProperties in the odata api to be expanded.
data: any[]Result last propagated to subscribed observers. Setting this value would update subscribed observers.
loading: ObservableObservable that indicates if data is being loaded.
errors: ObservableObservable that indicates errors being returned from the OData api. Emits errors from httpClient or null when they are cleared by subsequesnt successful requests.
refresh()Triggers a new request to refresh the data.

ODataFilter

ODataFilter has getFilter() method which needs to return an object that conforms to odata-query filter definition. Individual filters are then composed together using 'and' operator.

12.3.0

2 years ago

15.3.0

2 years ago

15.4.0

2 years ago

10.3.0

2 years ago

13.3.0

2 years ago

14.3.0

2 years ago

11.3.0

2 years ago

16.4.0

2 years ago

9.3.0

4 years ago

9.2.0

5 years ago

8.2.0

5 years ago

1.2.0

6 years ago

1.1.1

6 years ago

1.1.0

7 years ago

1.0.4

7 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago