Widget Tricks - ods-results

ods-results is a rather simple widget to list records from a dataset. They can be displayed as a list or cards.

ods-results widget documentation

Several Code Library resources rely on ods-results, for example the table module component, to list records in a table. The search module component, to display the results of a search query. The generators also use an ods-results internally to list dataset content.

Simple usage, list records !

ods-results returns an array: the list of records. Records are objects, and all the metas are accessible through the fields key.

ng-repeat directive loop over each record and “print” the HTML for each record. For more advanced usage, please refer to the AngularJs ng-repeat documentation here

This first simple resource lists districts in Brussels, Belgium.

Cards list

With ODS layout system, you can easily list results and print each record as a card.

Note that these codes also relies on this resource that over-rides this ODS layout.

It can then be combined with other widgets, by getting a metadata from the record, and feeding another widget with it. In this example, we get the shape of the record, and feed ods-geotooltip with its value.

Pagination block

ods-pagination-block can be added to paginate your results.

Beware of setting the same number of results in your ods-results-max and per-page parameters.

More advanced cards with record images

This example get image from the dataset with ods-record-image. It also displays the cost if the meta is filled.

The geolocation at the bottom of the card displays the address if it exists, or the word “Location” if the field is empty.