JQuery Datatables - 'No data available' (but data still showing)

Question

I assume this is a recurrent issue here in SO, but I couldn't find my exact situation here, nor any question which resembled my problem.

I'm working on a AngularJS environment with a jQuery Datatable. I simply want to show a table in a tab, inside a HTML:

<div class="ng-cloak">
<script type="application/javascript">
    $(document).ready(function () {

        // Tabla Pestaña Extensiones (Tab 4)
        $('#table_id').DataTable({
            language: {
                processing:     "Tratamiento en curso...",
                search:         "Buscar&nbsp;:",
                lengthMenu:     "Mostrar _MENU_ elementos",
                info:           "Mostrando _START_ a _END_ de _TOTAL_ elementos",
                infoEmpty:      "Viendo los elementos 0 - 0 de _TOTAL_ elementos",
                infoFiltered:   "(filtrado de _TOTAL_ elementos)",
                infoPostFix:    "",
                loadingRecords: "Cargando datos...",
                zeroRecords:    "No hay datos para mostrar",
                emptyTable:     "No hay datos disponibles en la tabla",
                paginate: {
                    first:      "Primero",
                    previous:   "Anterior",
                    next:       "Siguiente",
                    last:       "Último"
                },
                aria: {
                    sortAscending:  ": habilitado para ordenar la columna en orden ascendente",
                    sortDescending: ": habilitado para ordenar la columna en orden descendente"
                }
            }
        });
    })
</script>
</div>

...

<uib-tab index="3" heading="Extensiones">
    <div class="padding-vertical-20 row">
        <div class="col-xs-12">
            <table id="table_id" class="table table-hover nowrap">
                <thead>
                    <tr>
                        <th>Número</th>
                        <th>Tipo de extensión</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="ext in vm.currentCenExtensiones">
                        <td>{{ ext.number }}</td>
                        <td>{{ ext.extensions_type}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</uib-tab>

The result here is as follows:

As you can see, I get the data, but I can't get rid of the 'No data available' (in Spanish) nor I can sort columns, as data dissappears. I tried to wrap the entire table definition with ng-cloak, but it's not working. Also tried this approach, with no solution.

What am I missing out here? Thanks a lot.