Angular Controller error in index.ejs
Question
I have an index.ejs page that has a slideMenu which inserts other HTML views in the index.ejs page.
Each html view has its own controller. Each controller is in its own .js file. I am including all these scripts in the index.ejs file, however this causes the following problem and the HTML views don't load properly.
<!DOCTYPE html>
<html ng-app="myapp" xmlns:width="http://www.w3.org/1999/xhtml">
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css'/>
</head>
<body layout="column">
<!-- ANGULAR MATERIAL DEPENDENCIES -->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<!-- ANGULAR MATERIAL DEPENDENCIES END-->
<md-content>
<div ng-include="'/html/newCode/addCircleTimeSong.html'"></div>
</md-content>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
<script src="javascripts/newCode/Controller_CircleTimeSongPage.js"></script>
<script src="javascripts/newCode/Controller_ObservationPage.js"></script>
<script src="javascripts/newCode/Controller_CircleTimeActivityPage.js"></script>
</body>
</html>
I get the following error:
Error: [ng:areq] http://errors.angularjs.org/1.4.8/ng/areq?p0=CircleTimeSongPageController&p1=not%20aNaNunction%2C%20got%20undefined
1 answers
solution1
1 ACCPTED 2016-12-28 11:30:13
If you have written this statement
var mainApp = angular.module("myapp", ['ngMaterial']);
in all the controller files. This is what causing this error. This statement creates and initializes the myapp module. So if you use this statement in all the controller files, you will be reinitializing the myApp every time hence the angular error.
Replace it with this statement in other controller files
var mainApp = angular.module("myapp");
The above statement means fetch/reference already created/initialized myapp module.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.