AngularJS Error: DataTable not a function

Hi, Can anyone please help me on angular js issue with my c#.net project

I am using angular js and Ajax DataTable using but i am declare the DataTable inside script i got error in "DataTable not a function".

var data = dTable.row($row).data();

I declare all supporting script files. My code is

$scope.getalldata = function () {       
    $http({
        method: "get",
        url: "https://localhost:44336/admin/unittype/getalldata"
    }).then(function (response) {
        $scope.record = response.data;
 
        angular.element(document).ready(function () {
             
            dTable = $('#tbl_unittypelist').DataTable({
                "processing": false,
                "sorting": true,
                "serverSide": false,
                "order": [[0, 'desc']],
                "paging": true,
                "bDestroy": true,
                "fnStateSave": function (oSettings, oData) {
                    localStorage.setItem('DataTables', JSON.stringify(oData));
                },
                "fnStateLoad": function (oSettings) {
                    return JSON.parse(localStorage.getItem('DataTables'));
                },
                //header checkbox
                headerCallback: function (thead, data, start, end, display) {
                    thead.getElementsByTagName('th')[0].innerHTML = `
                <label class="">
                    <input name="select_all" type="checkbox" value="1" class="select_all" id="select_all" />
                    <span></span>
                </label>`;
                },
                'rowCallback': function (row, data, dataIndex) {
                    var rowId = data.supid;//check this id
 
                    if ($.inArray(rowId, rows_selected) !== -1) {
                        $(row).find('input[type="checkbox"]').prop('checked', true);
                    }
                    else {
                        $(row).find('input[type="checkbox"]').prop('checked', false);
                    }
                },
 
                "footerCallback": function (row, data, start, end, display) {
                },
 
                "columnDefs": [
                    {
                        targets: 0,
                        width: '30px',
                        className: 'dt-left dtr-control',
                        orderable: false,
                        render: function (data, type, full, meta) {
                            console.log(data);
                            return '<label class="checkboxs"> ' +
                                '<input type="checkbox" id="chk_item" class="checkable" name="chk_item" value=' + data + ' />' +
                                '<span></span>' +
 
                                '</label>';
                        },
                    }
                ],
                select: {//this section add class name for selected checkbox
                    style: 'os',
                    className: 'selecteds'
                },
 
 
            });
        });
 
        //for each page selectable checkbox while click on heaser checkbox --start
        $('#tbl_unittypelist tbody').on('click', 'input[type="checkbox"]', function (e) {
            var $row = $(this).closest('tr');
            var data = dTable.row($row).data();
            var rowId = data.unittypeid;
            var index = $.inArray(rowId, rows_selected);
 
 
            if (this.checked && index === -1) {
                rows_selected.push(rowId);
            } else if (!this.checked && index !== -1) {
                rows_selected.splice(index, 1);
            }
            updateDataTableSelectAllCtrl(dTable);
            e.stopPropagation();
        });
 
        $('#tbl_unittypelist thead input[name="select_all"]', dTable.table().container()).on('click', function (e) {
 
            if (this.checked) {
 
                $('#tbl_unittypelist tbody input[type="checkbox"]:not(:checked)').trigger('click');
            } else {
 
                $('#tbl_unittypelist tbody input[type="checkbox"]:checked').trigger('click');
            }
            e.stopPropagation();
        });
        //for each page selectable checkbox while click on heaser checkbox --end
        dTable.on('draw', function () {
            updateDataTableSelectAllCtrl(dTable);
        });
 
 
        //header select all checkbox click action --start
        dTable.on('change', '.select_all', function () {
            var set = $(this).closest('table').find('td:first-child .checkable');
            var checked = $(this).is(':checked');
 
            $(set).each(function () {
                if (checked) {
                    $(this).prop('checked', true);
                    //$(this, allPages).closest('tr').addClass('selecteds');
 
                    dTable.rows().select();
                    dTable.rows().every(function () {
                        var d = this.data();
 
                        var rowId = d.unittypeid;//this rowid changed for every table default id
                        var index = $.inArray(rowId, rows_selected);
                        if (index === -1) {
                            rows_selected.push(rowId);
                        }
                    });
                    $('#btn_deleteall').show();
                }
                else {
                    $(this).prop('checked', false);
                    //$(this).closest('tr').removeClass('selecteds');
                    dTable.rows().deselect();
                    rows_selected = [];
                    $('#btn_deleteall').hide();
                }
            });
        });
        //header select all checkbox click action --end
        //for each row checkbox click action --start
        dTable.on('change', 'tbody tr .checkboxs', function () {
            var checked = $(this).find('.checkable').is(':checked');
            if (checked) {
                $(this).parents('tr').addClass('selecteds');
 
                $('#btn_deleteall').show();
            }
            else {
                $(this).parents('tr').removeClass('selecteds');
                var count = dTable.rows('.selecteds').count();
                if (count < 1) {
                    $('#btn_deleteall').hide();
                };
            }
        });
        //for each row checkbox click action --end
        $('.dataTables_wrapper').children('div').removeClass("btn-group");
    }, function () {
        alert("Error Occur");
    })
};