Uncaught TypeError: b.$apply is not a function in angular-datatables

Question

I'm having this error: Uncaught TypeError: b.$apply is not a function each time I click the Edit button(should trigger the directive ng-click but it shows the error from above)

Here are the docs

Here is the html

<div class="card">
  <div class="card-header">
    <h1>Retenciones</h1>
  </div>
  <div class="card-body card-padding">
    <div >
      <table ng-if="retencionesController.authorized" dt-instance="retencionesController.dtInstance" datatable="" dt-options="retencionesController.dtOptions" dt-columns="retencionesController.dtColumns"
        class="row-border hover"></table>
    </div>
  </div>
</div>

And this is my controller

(function(){
    angular.module('statusTrackAppApp').controller('retencionesController',retencionesController);
    function retencionesController($http,apiPath,DTOptionsBuilder, DTColumnBuilder,$compile){
        var vm=this;
        vm.authorized = false;  
        vm.dtInstance = {};
        vm.retencion ={};
        $http.get(apiPath+'retenciones').then(function(response){
            if(response.status ==200){
                vm.authorized=true;
                var facturas=response.data;
                vm.dtOptions = DTOptionsBuilder.newOptions()
                .withOption('data', facturas) 
                .withOption('createdRow', createdRow)
                // .withOption('scrollY', 300)
                .withPaginationType('full_numbers');
                vm.dtColumns = [
                    DTColumnBuilder.newColumn('_id').withTitle('ID').notVisible(),
                    DTColumnBuilder.newColumn('noFactura').withTitle('Número de Factura'),
                    DTColumnBuilder.newColumn('importe').withTitle('Importe'),
                    DTColumnBuilder.newColumn('tipoMoneda').withTitle('Tipo de Moneda'),
                    DTColumnBuilder.newColumn('updates').withTitle('Comentarios/Updates'),
                    DTColumnBuilder.newColumn(null).withTitle('Acciones').notSortable().renderWith(actionButtons)
                ];

            }
        }).catch(function(error){
            console.log(error);
        });


        function actionButtons(data,type,full,meta) {
            vm.retencion[data._id]=data;
            return '<button class="btn btn-info btn-sm" ng-click="retencionesController.editProject(retencionesController.retencion[\'' +data._id+ '\'])">'+
            'Editar</button>'

        }

        function createdRow(row, data, dataIndex) {
            // Recompiling so we can bind Angular directive to the DT
            $compile(angular.element(row).contents())(vm);
        }

        vm.editProject = function(retencion){
            console.log('it works'+ JSON.parse(retencion));
            vm.dtInstance.reloadData();
        }
    }
})();

btw I added the controller to the view with ui-router

Answer 1

Found the solution, I should use $scope instead of vm ( its value is 'this')

replacing

function createdRow(row, data, dataIndex) {
            // Recompiling so we can bind Angular directive to the DT
            $compile(angular.element(row).contents())(vm);
        }

with this

 function createdRow(row, data, dataIndex) {
            // Recompiling so we can bind Angular directive to the DT
            $compile(angular.element(row).contents())($scope);
        }