title: Tried to load angular more than once in Angular js
body: <p>problem </p>
  
  <ul>
  <li>i was using jquery with angular js .</li>
  </ul>
  
  <p>error</p>
  
  <pre><code>angular.js?v=1.6.10_1474366451:12116 TypeError: ha is not a function
  at eval (eval at &lt;anonymous&gt; (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:2:2616), &lt;anonymous&gt;:17:349)
  at eval (eval at &lt;anonymous&gt; (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:2:2616), &lt;anonymous&gt;:308:401)
  at http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:2:2616
  at Function.globalEval (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:2:2627)
  at text script (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:26788)
  at Qc (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:18505)
  at x (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:21926)
  at b (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:26298)
  at Object.send (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:26402)
  at Function.ajax (http://localhost/weblogs-s2/web/common/assets/libs/jquery/jquery.min.js?v=1.6.10:4:21703) &lt;div id="wrapper" ui-view="" class="container ng-scope"&gt;(anonymous function) @ angular.js?v=1.6.10_1474366451:12116(anonymous function) @ angular.js?v=1.6.10_1474366451:8976invokeLinkFn @ angular.js?v=1.6.10_1474366451:8527nodeLinkFn @ angular.js?v=1.6.10_1474366451:8034compositeLinkFn @ angular.js?v=1.6.10_1474366451:7435publicLinkFn @ angular.js?v=1.6.10_1474366451:7309updateView @ angular-ui-router.js?v=1.6.10_1474366451:2733(anonymous function) @ angular-ui-router.js?v=1.6.10_1474366451:2697$broadcast @ angular.js?v=1.6.10_1474366451:15893$state.transition.resolved.then.$state.transition @ angular-ui-router.js?v=1.6.10_1474366451:2114processQueue @ angular.js?v=1.6.10_1474366451:14347(anonymous function) @ angular.js?v=1.6.10_1474366451:14363$eval @ angular.js?v=1.6.10_1474366451:15574$digest @ angular.js?v=1.6.10_1474366451:15385$apply @ angular.js?v=1.6.10_1474366451:15679done @ angular.js?v=1.6.10_1474366451:10166completeRequest @ angular.js?v=1.6.10_1474366451:10338requestLoaded @ angular.js?v=1.6.10_1474366451:10279
  </code></pre>
  
  <p>Failed to parse SourceMap: <a href="http://localhost/weblogs-s2/web/metisMenu.js.map" rel="nofollow">http://localhost/weblogs-s2/web/metisMenu.js.map</a></p>
  
  <pre><code>      &lt;div id="wrapper" ui-view="" class="container ng-scope"&gt;
  </code></pre>
  
  <p>angular js code</p>
  
  <pre><code> var sbAdmin2 = angular.module('sbAdmin2', ['ui.router','ngSanitize']);
  
  
  sbAdmin2.config(function($stateProvider, $urlRouterProvider) {
  
  $urlRouterProvider.otherwise('');
  
  $stateProvider
  
      // HOME STATES AND NESTED VIEWS ========================================
      .state('Dashboard', {
          url: '/dashboard/data',
          templateUrl: 'http://localhost/weblogs-s2/web/weblogs_dev.php/dashboard/data'
      })
  
     })
  </code></pre>
  
  <p>script i have used</p>
  
  <pre><code> &lt;html&gt;
    &lt;head&gt;
      &lt;script src="{{ asset ('common/assets/libs/jquery/jquery.min.js') }}?v={{ app_version }}"&gt;&lt;/script&gt;
       &lt;script src="{{ asset ('common/assets/libs/jquery/jquery-ui/js/jquery-ui.min.js') }}?v={{ app_version }}"&gt;&lt;/script&gt;
       &lt;script src="{{asset('common/assets/libs/angular/source/angular.js') }}?v={{ app_version }}_{{ NOW }}"&gt;&lt;/script&gt;
       &lt;script src="{{ asset ('common/assets/libs/angular/source/modules/angular-ui-router.js') }}?v={{ app_version }}_{{ NOW }}"&gt;&lt;/script&gt;
       &lt;script src="{{ asset ('common/assets/libs/angular/source/modules/angular-sanitize.js') }}?v={{ app_version }}_{{ NOW }}"&gt;&lt;/script&gt;
   &lt;/head&gt;
    &lt;body&gt;
    &lt;div id="wrapper" ui-view class="container ng-scope" &gt;
     &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>i have googled</p>
  
  <ul>
  <li>jquery conflicting with angular js library.</li>
  <li>when i load angular js before jquery application works fine.</li>
  <li>but i need to populate the data in datatable then datatable is is not working.</li>
  <li>which means for datatable  require jquery to first to first load.</li>
  </ul>
  
  <p>what i need</p>
  
  <ul>
  <li><p>is it possible to load jquery before angular js library or it may conflicts.</p>
  
  <pre><code>problem arise when i was using datatable using jquery then it  would not work when i used jquery after angular js.
  </code></pre></li>
  </ul>
  
  <p>any suggestion is most welcome </p>