Estoy realizando una chrome extension y quiero que los datos se muestren usando un dataTable pero al añadir datos mediante AngularJs aparecen en la datatable pero por ejemplo las entries y la busqueda no muestran los datos recientemente añadidos hasta que se recarga la pagina
app.run(['$rootScope', function($rootScope){
chrome.storage.sync.get(['ags','switch'], function(data){
$rootScope.test = [];
$rootScope.isEmpty = true;
$rootScope.table;
if(data.ags!=undefined){
$rootScope.test = data.ags;
$rootScope.isEmpty = false;
}
if(data.switch!=undefined){
$rootScope.switch = data.switch;
}
else
$rootScope.switch = false;
});
$(document).ready(function() {
$rootScope.tabla = $('#rowTable').DataTable({
"ordering": false,
"deferRender": true
});
});
}])
<table ng-hide="!test.length || showReset"
id="rowTable" class="table table-hover table-bordered">
<thead>
<tr>
<th class="table_name"> Nombre </th>
<th class="table_ip"> Ip </th>
<th class="table_actions">Acciones</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in test track by $index" ng-cloak ng-
click="changeUrl(row)" ng-class="{rowOn: row.is_on}">
<td class="table_name">{{row.name}}</td>
<td class="table_ip">{{row.ip}}</td>
<td class="table_actions">
<i class="material-icons material-icons-m"
ng-click="edit($index); $event.stopPropagation()">mode_edit</i>
<i class="material-icons material-icons-m"
ng-click="delete($index); $event.stopPropagation()">delete</i>
</td>
</tr>
</tbody>
</table> <br>
Añado aquí la funcion tal cual que uso para añadir datos
$scope.new = function(){
$rootScope.test.push(({"name":
document.getElementById('name').value,"ip":
document.getElementById('ip').value ,"is_on": false}));
chrome.storage.sync.set({'ags': $rootScope.test});
}
$digest