Angular Talk: 3 - Controllers

http://angularjs.org/

by boneskull

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<!-- body tag has ng-app="myApp" -->
<div ng-cloak>
<div ng-controller="MyCtrl">
    <h3>Available Toppings</h3>
     <ul ng-repeat="topping in toppings">
       <li>{{topping}}</li>
    </ul>
</div>
<br/>
<div ng-controller="SelectedToppingCtrl">
    <h3>Selected Toppings</h3>
    <ul ng-repeat="topping in selected_toppings">
        <li>{{topping}}</li>
    </ul>
</div>
</div>

CSS

li {
    display: list-item;
}

h3 {
    font-weight: bold;
}

JavaScript

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', ['$scope', function($scope) {
    $scope.toppings = ['ham', 'olives', 'anchovies'];
}]);

myApp.controller('SelectedToppingCtrl', ['$scope', function($scope) {
    $scope.selected_toppings = [];
}]);