I am trying to understand what is happening here. The warning is self-evident, and I understand that in an application with the code and structure that I have below, it runs ng-view twice ("test" will be registered twice in the console, so, of course, angular loads twice!) .... but why?
I read every post I could find about this, and it seems to load before jQuery loads to angular.
If I leave jQuery or load jQuery after angualr (which is not good practice from what I understand), no problem. I would like to have jQuery to support some functions (specifically ui-sortable ). And, although this does not actually cause any problems, I would like it to not execute my ng-view twice.
Am I doing something structurally wrong or am I missing an obvious way to fix this?
Update: Plunker problems (check console)
index.html
<!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Site Title</title> </head> <body ng-view> <script type="text/javascript"> console.log('test') </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.js"></script> <script type="text/javascript" src="app_simple.js"></script> </body> </html>
app_simple.js:
'use strict'; var myApp = angular.module('myApp', [ 'ngRoute' ]); myApp.config(function ($routeProvider) { $routeProvider .when('/simple', { templateUrl: 'components/simple/simple.html', controller: 'SimpleCtrl' }) .otherwise({ redirectTo: '/x' }) }); myApp.controller('SimpleCtrl', ['$scope', '$log', '$http', function($scope, $log, $http){ }]);
simple.html: My simple content