$ (...). DataTable не является функцией, используя угловые Js

проблемы

мы используем угловые & JQuery.
Проблема возникает при переключении состояния, которое указывает панель управления на мои журналы.
когда я запускаю url для mylogs, тогда datatable работает без ошибок.
затем я нажимаю на приборной панели, это не работает.
затем я снова нажимаю на ссылку mylogs, тогда угловой js не нашел функцию jquery datatable.
поэтому он выдает ошибку

углового код

var sbAdmin2 = angular.module('sbAdmin2', ['ui.router','ngSanitize']); 
    sbAdmin2.config(function($stateProvider, $urlRouterProvider) { 

    $urlRouterProvider.otherwise('/dashboard/data'); 

    $stateProvider 
     .state('Dashboard', { 
      url: '/dashboard/data', 
      templateUrl: 'http://localhost/weblogs-s2/web/weblogs_dev.php/dashboard/data' 
     }) 
       .state('My Logs', { 
          url: '/my_dt_test', 
          data: { 
           pageHeader: 'My Logs', 
           ncyBreadcrumbLabel: 'My Logs' 
          }, 
          ncyBreadcrumb: { 
           label: 'My Logs' 
          }, 
          views: { 
           "@": { 
            templateUrl: 'http://localhost/weblogs-s2/web/weblogs_dev.php/my_datatable_list1' 

           } 
          } 
         })

HTML

<script src="http://code.jquery.com/jquery-2.1.1.js"></script> 
    <script src="{{ asset ('common/assets/libs/jquery/jquery-ui/js/jquery-ui.min.js') }}?v={{ app_version }}"></script> 
    <script src="{{asset('common/assets/libs/angular/source/angular.js') }}?v={{ app_version }}_{{ NOW }}"></script> 
    <script src="{{ asset ('common/assets/libs/angular/source/modules/angular-ui-router.js') }}?v={{ app_version }}_{{ NOW }}"></script> 
    <script src="{{ asset ('common/assets/libs/angular/source/modules/angular-sanitize.js') }}?v={{ app_version }}_{{ NOW }}"></script> 


     <!-angular version 1.06------> 
     <body> 
     <div id="test" ui-view> 
     {% body_block %}{%endblock%} 
      </div> 
      </body>

DataTable визуализируется в виде HTML

  var dataTableVar_eserv_mylogs_new_table = $('#eserv_mylogs_new_table').dataTable({ 
      "columns": [{"sTitle":"Job_NO","sName":"logId"},{"sTitle":"customer","sName":"customer"}], 
      "bProcessing": true, 
      "bServerSide": true, 
      "sAjaxSource": dataTable_ajax_source_eserv_mylogs_new_table, 
      "sPaginationType": "full_numbers", 
      "asStripeClasses": null, 
      "iDisplayLength": 10, 
      //"colReorder": true, 



      "paging": true, 


      buttons: [{ 
      extend: 'colvis', 
      text: 'Custom Columns', 
      className: 'btn btn-default pull-right extra_btn' 
     }], 
      "oLanguage": { 
       "sProcessing": (typeof PreloaderImagePath != 'undefined' ? '<img alt="Loading data... Please wait" src="' + PreloaderImagePath + '" />' : 'Processing...'), 
       "sInfoFiltered": " (filtered from _MAX_ total entries)", 
       "oPaginate": { 
        "sFirst": "First", 
        "sLast": "Last", 
        "sNext": "Next", 
        "sPrevious": "Previous" 
       }, 
       "sZeroRecords": "No data available in table", 
       "sInfoEmpty": "Showing 0 to 0 of 0 entries", 
       "sInfo": "Showing _START_ to _END_ of _TOTAL_ entries", 
       "sLengthMenu": '<span class="desktop_inline_text">Show</span> _MENU_ <span class="desktop_inline_text">Rows</span>' 
      },

datatable мы рендеринг через библиотеку symfony2.
```
on page reload its working then its stop working on swapping state 
```

им Ошибка при получении

 TypeError: $(...).dataTable is not a function 
at eval (eval at globalEval (http://code.jquery.com/jquery-2.1.1.js:330:5), <anonymous>:18:84) 
at Function.globalEval (http://code.jquery.com/jquery-2.1.1.js:330:5) 
at jQuery.domManip (http://code.jquery.com/jquery-2.1.1.js:5411:16) 
at jQuery.append (http://code.jquery.com/jquery-2.1.1.js:5194:15) 
at jQuery.<anonymous> (http://code.jquery.com/jquery-2.1.1.js:5309:18) 
at jQuery.access (http://code.jquery.com/jquery-2.1.1.js:3465:8) 
at jQuery.html (http://code.jquery.com/jquery-2.1.1.js:5276:10) 
at http://localhost/weblogs-s2/web/common/assets/libs/angular/source/modules/angular-ui-router.js?v=1.6.10_1475157720:2791:18 
at invokeLinkFn (http://localhost/weblogs-s2/web/common/assets/libs/angular/source/angular.js?v=1.6.10_1475157720:8525:9) 
at nodeLinkFn (http://localhost/weblogs-s2/web/common/assets/libs/angular/source/angular.js?v=1.6.10_1475157720:8034:11) <div id="wrapper" ui-view="" class="container ng-scope font_size_100">

я пытался отладить эту проблему угловой фрагмент кода

 .state('My Logs', { 



         url: '/my_dt_test', 

         views: { 



          "@": { 



           templateUrl: function ($node) { 

            console.log("testing"); 

            return root_url + 'my_datatable_list1'; 
           } 


          } 

         } 
         })

вопрос я нашел, когда я перезагрузить URL mydb_test то datatable отображается без ошибок.
после того, когда я изменить состояние я получаю значение в console.log но Безразлично "т вернуть любой файл шаблона.
это только ошибка отображения DataTable не является функцией я думаю, что JQuery делает некоторые проблемы.

что нам нужно

мы проверили Jquery грузы первый раз в верхнем порядке, но когда угловые JS работает он бы не смог вызвать DataTable функцию JQuery.
советую в этом выпуске.

источник

2016-09-29 afeef

Загружена ли библиотека данных данных? – epascarello

datatable визуализируется через php – afeef

Мы не использовали ни одного lib of datatble, у нас есть symfony2 lib – afeef

-1

Добавить run block и после каждого state-change, захватить state-change-success и перезагрузки таблиц данных.

var sbAdmin2 = angular.module('sbAdmin2', ['ui.router','ngSanitize']); 
    sbAdmin2.config(function($stateProvider, $urlRouterProvider) { 

    $urlRouterProvider.otherwise('/dashboard/data'); 

    $stateProvider 
     .state('Dashboard', { 
      url: '/dashboard/data', 
      templateUrl: 'http://localhost/weblogs-s2/web/weblogs_dev.php/dashboard/data' 
     }) 
       .state('My Logs', { 
          url: '/my_dt_test', 
          data: { 
           pageHeader: 'My Logs', 
           ncyBreadcrumbLabel: 'My Logs' 
          }, 
          ncyBreadcrumb: { 
           label: 'My Logs' 
          }, 
          views: { 
           "@": { 
            templateUrl: 'http://localhost/weblogs-s2/web/weblogs_dev.php/my_datatable_list1' 

           } 
          } 
         }) 
    }); 

    sbAdmin2.run(function($rootScope) { 
     $rootScope.$on('$stateChangeSuccess', function(event, toState){ 
     angular.element('#eserv_mylogs_new_table').dataTable(); 
     }) 
    })

источник

2016-09-29 12:32:45 Sravan

привет сарван, я пробую то же самое, becuse, как только jquery загружает его нормально, но работает с угловым, не вызывая функцию datatable, которую мы получаем той же ошибкой – afeef

делает $ rootScope. $ on ('$ stateChangeSuccess') получает вызов? 'console.log' и отметьте – Sravan

@afeef, вы снизили его? – Sravan

$ (...). DataTable не является функцией, используя угловые Js

ответ

Смежные вопросы