ElyDotDev/addition-controller-params.html

## addition-controller-params.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="addition-controller-params.js"></script>
</head>
<body ng-app="app">
<p ng-controller="AdditionController">
    {{add(number, 2)}} is not the same as {{add(number, "2")}}
    <br>
    2 + 2 + 2 + 2 = {{add(2, add(2, add(2, 2)))}}
</p>
</body>
</html>

## addition-controller-params.js
function AdditionController($scope)
{
	$scope.number = 2;
	$scope.add = function (operand1, operand2)
	{
		return operand1 + operand2;
	}
}

## addition-controller.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="addition-controller.js"></script>
</head>
<body ng-app="app">
<p ng-controller="AdditionController">
    <select ng-model="operand1" ng-options="x for x in options"></select>
    + <select ng-model="operand2" ng-options="x for x in options"></select>
    = {{add()}}
</p>
</body>
</html>

## addition-controller.js
function AdditionController($scope)
{
	$scope.operand1 = 0;
	$scope.operand2 = 0;
	$scope.add = function ()
	{
		return $scope.operand1 + $scope.operand2;
	}
	$scope.options = [0, 1, 2, 3, 4];
}

## count-controller.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="count-controller.js"></script>
</head>
<body ng-app="app">
<p ng-controller="CountController">
    There are {{count()}} months in a year.
</p>
</body>
</html>

## count-controller.js
function CountController($scope)
{
	$scope.count = function ()
	{
		return 12;
	}
}

## empty-controller.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="empty-controller.js"></script>
</head>
<body ng-app="app">
<p ng-controller="EmptyController">

</p>
</body>
</html>

## empty-controller.js
function EmptyController()
{

};

## form-submit-controller.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="form-submit-controller.js"></script>
</head>
<body ng-app="app">
<div id="form_wrapper" ng-controller="FormSubmitController">
    <form ng-show="notSubmitted">
        <input type="text" name="feedback"/>
        <input type="submit" value="Submit Feedback" ng-click="toggle()"/>
    </form>
    <div ng-hide="notSubmitted">Thanks for submitting your feedback!</div>
</div>
</body>
</html>

## form-submit-controller.js
function FormSubmitController($scope)
{
	$scope.notSubmitted = true;
	$scope.toggle = function ()
	{
		$scope.notSubmitted = !$scope.notSubmitted
	};
}

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
</head>
<body ng-app="app">
<!-- Other examples to be inserted here. -->
</body>
</html>

## message-controller-as.js
function MessageController()
{
	this.message = "This is a model.";
}

## message-controller-scope.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="message-controller-scope.js"></script>
</head>
<body ng-app="app">
<p ng-controller="MessageController">
    {{message}}
</p>
</body>
</html>

## message-controller-scope.js
function MessageController($scope)
{
	$scope.message = "This is a model.";
}

## message-controller.html
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- AngularJS 1.4.8 !-->
    <script src="../src/angular.min.js"></script>
    <script src="module.js"></script>
    <script src="message-controller-as.js"></script>
</head>
<body ng-app="app">
<p ng-controller="MessageController as controller">
    {{controller.message}}
</p>
</body>
</html>

## module.js
angular.module('app', []);
angular.module('app').config(['$controllerProvider', function ($controllerProvider)
{
	$controllerProvider.allowGlobals();
}]);
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<!-- AngularJS 1.4.8 !-->
	<script src="../src/angular.min.js"></script>
	<script src="module.js"></script>
	<script src="addition-controller-params.js"></script>
	</head>
	<body ng-app="app">
	<p ng-controller="AdditionController">
	{{add(number, 2)}} is not the same as {{add(number, "2")}}
	<br>
	2 + 2 + 2 + 2 = {{add(2, add(2, add(2, 2)))}}
	</p>
	</body>
	</html>
	function AdditionController($scope)
	{
	$scope.number = 2;
	$scope.add = function (operand1, operand2)
	{
	return operand1 + operand2;
	}
	}
	function AdditionController($scope)
	{
	$scope.operand1 = 0;
	$scope.operand2 = 0;
	$scope.add = function ()
	{
	return $scope.operand1 + $scope.operand2;
	}
	$scope.options = [0, 1, 2, 3, 4];
	}
	function CountController($scope)
	{
	$scope.count = function ()
	{
	return 12;
	}
	}
	function FormSubmitController($scope)
	{
	$scope.notSubmitted = true;
	$scope.toggle = function ()
	{
	$scope.notSubmitted = !$scope.notSubmitted
	};
	}
	function MessageController()
	{
	this.message = "This is a model.";
	}
	function MessageController($scope)
	{
	$scope.message = "This is a model.";
	}
	angular.module('app', []);
	angular.module('app').config(['$controllerProvider', function ($controllerProvider)
	{
	$controllerProvider.allowGlobals();
	}]);