I am creating SPA using AngularJS, Laravel and UI-Router. In the laravel routes.php file, I have one route '/' that loads index.php, which includes all my dependencies and where angular loads. As a child of an angular root crop, I have a div with the ui-view attribute. This div is where my angular templates load using the UI-Router.
In my angular.config module, I have several UI-Router state settings:
app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/');
$stateProvider
.state('home',
{
url: '/home',
templateUrl: 'templates/home.html',
controller: 'HomeController'
})
.state('projects',
{
url: '/projects',
templateUrl: 'templates/projects/index.html',
controller: 'ProjectController'
})
.state('projects.create',
{
url: '/projects/create',
templateUrl: 'templates/projects/create.html',
controller: 'ProjectController'
});
}]);
The problem is that when loading the third state of "projects.create", the browser does not load angular with my main js / app.js module. It gives an error message: "WARNING: Tried to load angular more than once."
, "". , , URL- "projects.create" "/createproject", "/projects/create", .
, "js/app.js" . , URL- ?
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AngularJS App</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
</head>
<body ng-app="scynergyApp">
<div class="container">
<div ui-view>
</div>
</div>
</body>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.8/angular-ui-router.min.js"></script>
<script src="/js/angular-sanitize.js"></script>
<script src="/js/underscore.js"></script>
<script src="/js/app.js"></script>
<script src="/js/controllers/HomeController.js"></script>
<script src="/js/controllers/ProjectController.js"></script>
</html>
routes.php
<?php
Route::get('/', function(){
return View::make('index');
});
Route::group(array('prefix'=>'/api'),function(){
Route::post('login','AuthController@Login');
Route::get('logout','AuthController@Logout');
Route::resource('projects','ProjectsController', array('except' => array('create', 'edit', 'update')));
});
App::missing(function($exception)
{
return View::make('index');
});