<!DOCTYPE html>
<html data-ng-app="app">
<head>
<script data-require="angular.js@*" data-semver="1.0.8" src="http://code.angularjs.org/1.0.8/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
<title>This is a way of extending controllers</title>
</head>
<body data-ng-controller="TestCtrl">
<h1 data-ng-bind="greeting"></h1>
<h2 data-ng-bind="text"></h2>
<h2 data-ng-bind="textOriginal"></h2>
</body>
</html>
// Code goes here
var app = angular.module('app', []);
app.controller('defaultTestCtrl', ['$scope', function ($scope) {
$scope.greeting = "Hello core ACEAD!";
$scope.text = "This is a message from default controller!";
}]);
app.controller('TestCtrl', ['$scope', '$controller', function ($scope, $controller) {
angular.extend(this, $controller('defaultTestCtrl', {$scope: $scope}));
$scope.greeting = "Hello extended ACEAD!";
$scope.textOriginal = $scope.text; // not so cute but still works
$scope.text = "This is a message from modified controller!";
}]);
/* Styles go here */