Problem Datatable Angular Js

0

I'm trying to use the Managed datatable . In my controller I have the following function:

angular.module('MetronicApp').controller('OperatorsController', function ($rootScope, $scope, $http, $timeout, $stateParams, $window, $http) {
    $scope.$on('$viewContentLoaded', function () {
        // initialize core components
        App.initAjax();
    });
    $scope.operators = "";
    $scope.operators= new Array({id:1}, {id:2});
    
    console.log($scope.operators);
    $scope.url = "http://localhost/STAPI/"

    //alert($stateParams.id)
    //window.localStorage.setItem('id', 1)
    //console.log(window.localStorage.getItem('id'))
    //$scope.verifyToken();
    if(window.localStorage.getItem('token') == null) {
        console.log('redirect');
    }

    $scope.verifyToken = function (token) {
        data = null;
        $http({
            cache: false,
            method: 'POST',
            url: $scope.url +'user.php',
            data: { ref: 'check-session', token: token },
            dataType: 'json',
        }).success(function (data) { // retorna json montado
            var json = angular.fromJson(data)
            console.log(json[0].id);
        })
    }

    

    $scope.loadGeneralOperators = function () {
        data = null;
        $http({
            cache: false,
            method: 'POST',
            url: $scope.url + 'operators.php',
            data: { ref: 'list-my-operators', clientId: 1 },
            dataType: 'json',
        }).success(function (data) { // retorna json montado
            var json = angular.fromJson(data)
            //$scope.operators = json;
            console.log(json[0].id);
        })
    }
    


    //Functions autoload
    $scope.loadGeneralOperators();

    // set sidebar closed and body solid layout mode
    $rootScope.settings.layout.pageContentWhite = true;
    $rootScope.settings.layout.pageBodySolid = false;
    $rootScope.settings.layout.pageSidebarClosed = false;
});

My html looks like this:

...

<tr class="odd gradeX" ng-repeat="n in operators">
                            <td>
                                <label class="mt-checkbox mt-checkbox-outline mt-checkbox-single">
                                    <input type="checkbox" class="checkboxes" value="1" />
                                    <span></span>
                                </label>
                            </td>
                            <td> {{n.id}} </td>
                            <td>
                                <a href="mailto:[email protected]"> [email protected] </a>
                            </td>
                            <td> 120 </td>
                            <td class="center"> 12 Jan 2012 </td>
                            <td>
                                <span class="label label-sm label-success"> Approved </span>
                            </td>
                        </tr>
                        
...
<script>
    TableDatatablesManaged.init();
</script>
However when performing the search in the datatable it does not recognize all the values and returns to {{n.id}} How could I fix it? Thank you     
asked by anonymous 21.07.2017 / 18:52

1 answer

1

You need to add

datatable="ng"
in your "table" tag for the angular-datatables understand the iteration of ngRepeat.     
26.07.2017 / 03:50