Is there an angular2 way for tables

[alateefah]

What versions you are using?

• angular version (cli): 1.0.0-beta.19-3
• jquery version: 3.1.1
• datatables version: 2.1.1
• angular-datatables version: 2.0.1

What's the problem?

Table content is displayed and i still get "No data available in table error". In angular 1, datatable="ng" solved my problem. This doesn't seem to work i angular 2.

Can you share your code?

Event	Period	Channel	Limit	Status
Transfer To International Bank	Daily	Web	90 PER TRANSACTION	ACTIVE
BillPayment	Daily	Mobile	90 PER TRANSACTION	ACTIVE
Recharge	Daily	Web	90 PER TRANSACTION	ACTIVE
Any transaction	Daily	Web	90 PER TRANSACTION	ACTIVE
Intratransfer	Daily	Any Channel	90 PER TRANSACTION	ACTIVE
Intratransfer	Daily	Web	90 PER TRANSACTION	ACTIVE
Intertransfer	Daily	Web	90 PER TRANSACTION	ACTIVE
Selftransfer	Daily	Web	90 PER TRANSACTION	ACTIVE
Selftransfer	Weekly	Any Channel	90 PER TRANSACTION	ACTIVE
No data available in table

<table datatable="ng" class="table limitTable">
        <thead class="thead-blue">
          <tr>
              <th>Event</th>
              <th>Period</th>
              <th>Channel</th>                
              <th>Limit</th>
              <th>Status</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let userLimit of userLimits"  [class.even]="'table-alt-color'">
              <td>{{userLimit.events}}</td>
              <td>{{userLimit.periods}}</td>
              <td>{{userLimit.channels}}</td>
              <td>{{userLimit.limitName}}</td>
              <td>{{userLimit.status}}</td>
          </tr>
        </tbody>      
      </table>

[adriangraf]

If you use the angular cli then you can try the following:

npm install jquery
npm install @types/jquery
npm install datatables.net

than add the javascript to your scripts block in the angular-cli.json file
"../node_modules/jquery/dist/jquery.js",
"../node_modules/datatables.net/js/jquery.dataTables.js",

After that it should be possible to call
($('example')).dataTable();
in the ngOnInit or ngAfterViewInit

In the HTML the table should be marked with #example

[alateefah]

Still shows data not available in table

[l-lin]

angular-datatables v2.0.X still does not have any angular renderer. Thus you can't use it like this yet.

[matthewhegarty]

Are there any plans to add the angular renderer? Presumably this will stop many people from being able to use the library.
Is there a recommended way to populate the table with dynamic data?

[l-lin]

Yes, I plan to do it. However, as I'm still trying to figure out the front stack... It might take a while.

[matthewhegarty]

Excellent. It's a promising library, and having Angular2 support will be an essential addition.

[l-lin]

Duplicate of #955.