As I attempted to experiment with controllers by writing up a few examples, I encountered an issue where the controllers would not load. An error message appeared:
firstController is not a function
Upon doing some research, I discovered that Angular 1.3.x no longer supports global controllers. The new method of creating controllers involves defining them in the app.js file instead. This led me to question whether I now have to create all my controllers in this centralized file as opposed to having separate files for each controller. I tried adjusting the controller creation like so, but still faced challenges:
UPDATE: I modified my controller based on jedanput's suggestion, switching $scope to this.
app.controller('firstController', [function(){
this.name = "Tim";
}]);
I also found it frustrating that most examples out there still refer to the old approach used in Angular 1.2. Any assistance in understanding this issue would be highly appreciated.
EDIT: Here is the content of my index.html file. Hopefully, this will provide more context to help identify the problem.
<!DOCTYPE html>
<html lang="en" xmlns:ng="http://angularjs.org" id="ng-app" ng-app="myApp">
<head >
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ControllerAs</title>
<meta name="description" content="">
</head>
<body>
<div class="content" ng-view=""></div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.6/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.6/angular-route.js"></script>
<script type="text/javascript" src="../js/app.js"></script>
<script type="text/javascript" src="../js/directives/it-works.js"> </script>
<script type="text/javascript" src="../js/controllers/firstController.js"></script>
<script type="text/javascript" src="../js/controllers/secondController.js"></script>
</body>
</html>
Although I've managed to work without using Controllers thus far by relying on directives and services, I feel it's time to delve deeper into controllers. It seems like there might be a fundamental concept that eludes me. Once again, any guidance would be greatly valued.
UPDATE: despite making adjustments, the error persists. Sharing my app.js file below, hoping it may offer some insight into the issue.
var app = angular.module('myApp',[
'ngRoute'
]);
app.config(function($routeProvider) {
$routeProvider.when('/', {
templateUrl: "../partials/test-skeleton.html"
})
});