CODEWITHSUNDEEP
angular
DarioN1
DarioN1

Reputation: 2552

Angular2 - How to create a simple table

I need to know the correct practice to use in this scenario:

I have a WebApi that returns a tabular dataset and I have to show it using bootstrap tables...

How to implement it? Which bootstrap component should I use?

The table is very simple, it expose just few data and a button to go in the row detail...

Upvotes: 9

Views: 19916

Answers (2)

isuruAb
isuruAb

Reputation: 2240

You can use Bootstrap angular 2 data tables. check this URL

If you like to test another solution go with teradata covalent data table. Check this link

By using you can get responsive design with some more additional features such as: search facility, Pagination

Upvotes: 3

borkovski
borkovski

Reputation: 978

Here's an example of simple table that will redirect you to details on row click:

<table class="table table-hover">
    <thead>
        <tr>
            <td>Id</td>
            <td>Title</td>
            <td>Amount</td>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let transfer of transfers" [routerLink]="['/transfer']" [queryParams]="{ id: transfer.id }">
            <td>{{transfer.id}}</td>
            <td>{{transfer.title}}</td>
            <td>{{transfer.amount}}</td>
        </tr>
    </tbody>
</table>

I assumed you're working with transfers array and redirect based on id.

Upvotes: 11

Related Questions