Angular Modules and Controllers in Files

It is best practice in AngularJS applications to put the module and the controllers in separate JavaScript files.

In this example, payrollApp.js contains an application module definition, while EmployeeController.js contains the controller:
AngularJS Example

snippet

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
    <div ng-app="payrollApp" ng-controller="EmployeeController">
        $scope.Name = "Michael"; $scope.Age = "30";
    </div>

    <script src="payrollApp.js"></script>
    <script src="EmployeeController.js"></script>
</body>
</html>

payrollApp.js

var app = angular.module("payrollApp", []);

EmployeeController.js

app.controller("EmployeeController", function($scope) {
    $scope.Name = "Michael";
    $scope.Age = "30";
});