2016-01-14 4 views
1

У меня возник вопрос о вызове функции в директиве Angular. Ниже приведена моя директива, в которой я хочу инкапсулировать код из контроллера. Из контроллера я получаю URL и столбцы. dtOptions задано в директиве.угловые-datatables в директиве. Cant call function in withFnServerData()

Это работает до сих пор и появляется таблица. Проблема в том, что DTOptionsBuilder не вызывает функцию serverData. когда я добавляю скобки в FnServerData (serverData()), метод вызывается, но параметры не определены. Код работает, если он определен в контроллере.

Вы видите способ, который работает?

Директива

angular.module('tab') 
    .directive('tabledirective', tableDirective); 

    function tableDirective(DTOptionsBuilder, DTColumnBuilder, RESTService){ 


    return { 
     templateUrl: '../../views/tableTemplate.html', 
     restrict: 'E', 
     link: function (scope, elem, attr) { 
      var dtOption; 

      function serverData(sSource, aoData, fnCallback) { 
       //All the parameters you need is in the aoData variable 
       var draw = aoData[0].value; 
       var order = aoData[2].value; 
       var start = aoData[3].value; 
       var length = aoData[4].value; 
       var search = aoData[5].value; 
       //Then just call your service to get the records from server side 
       RESTService.get(scope.options.url, start, length, search, order, draw).success(function (result) { 
        var records = { 
         'draw': result.data.draw, 
         'recordsTotal': result.data.total, 
         'recordsFiltered': result.data.filtered, 
         'data': result.data.records 
        }; 
        fnCallback(records); 
       }); 
      }; 

      dtOption = DTOptionsBuilder 
       .newOptions() 
       .withFnServerData(serverData) 
       .withBootstrap() 
       .withDataProp('data') 
       .withOption('processing', true) 
       .withOption('serverSide', true) 
       .withOption('paging', true) 
       .withPaginationType('full_numbers') 
       .withDisplayLength(10); 

      scope.options.dtoptions = dtOption;  
     } 
    }; 
    } 

Контроллер

angular.module('tab') 
.controller('tableCtrl', tableCtrl); 

function tableCtrl(DTColumnBuilder, DTOptionsBuilder, $scope){ 

    $scope.options = { 
     dtcolumns: [ 
     DTColumnBuilder.newColumn('Age', 'Alter'), 
     DTColumnBuilder.newColumn('Adresse', 'Adresse'), 
     DTColumnBuilder.newColumn('Name', 'Name') 
     ], 
     dtoptions: '', 
     url: 'http://localhost:9000/api/Data/Get' 
    }; 
} 

ответ

0

Я решил проблему. угловые-данные служат уже директивой. Чтобы сообщить Angular, чтобы отобразить таблицу внутри области, вы должны добавить элемент <table> к некоторому элементу, который объявлен в шаблоне.

С $ компилировать таблицу получить вынесенное в рамках

return { 
    template: '<div></div>', 
    restrict: 'E', 
    link: function (scope, elem, attr) { 
     var dtOption; 

     ... 
     scope.options.dtoptions = dtOption; 
     elem.append('<table datatables=""...</table>'); 
     $compile(elem.contents())(scope); 

    } 
}; 
}