Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WARNING: Tried to load angular more than once. Angular JS

I am trying to view my app after running Grunt Build. I use grunt serve:dist to see all production ready build but in the browser I get an infinite loop saying:

WARNING: Tried to load angular more than once.

I have read this occurs because the TemplateURL: may be wrong after concatenation. As in this post: Tried to Load Angular More Than Once

But how do I fix this? Here is my app.js

/* global libjsapp:true */   'use strict';  var libjsapp = angular.module('libjsApp', [   'ngCookies',   'ngResource',   'ngSanitize',   'ngRoute' ]);  libjsapp.config(['$routeProvider', function ($routeProvider, $locationProvider) {     $routeProvider       .when('/', {         templateUrl: 'views/posts.html',         controller: 'PostsCtrl'       })       .otherwise({         redirectTo: '/'       });   }]); 
like image 694
Vishal Sakaria Avatar asked May 06 '14 16:05

Vishal Sakaria


2 Answers

In my case this was due to the following html code:

<!doctype html> <html> <head>   <meta charset="utf-8">   <title>Testapp</title> </head>  <body ng-app="testApp">    <main ui-view>    <script src="bower_components/jquery/jquery.js"></script>   <script src="bower_components/angular/angular.js"></script>   <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>    <script src="scripts/main.js"></script> </body>  </html> 

As you can see, the <main> is not closed. This led to my variant of 'WARNING: Tried to load angular more than once.' issue.

like image 163
jhohlfeld Avatar answered Oct 08 '22 10:10

jhohlfeld


This problem also is caused by using the current page as the templateUrl. This is especially problematic as it results in an infinite loop referencing itself over and over.

If you are getting an infinite loop that crashes your page, it's probably this. If you are getting CORS errors, it's probably due to including a script tag from another domain in your template.

$routeProvider.when('/', {    templateUrl: 'an/absolute/url/to/the/current/page.html' }); 
like image 35
Kevin Beal Avatar answered Oct 08 '22 10:10

Kevin Beal