controllers.md

Controllers

Here's where things get fun. Controllers are how we connect the model and the view. Here's a sample controller:

angular
  .module('app')
  .controller('someController', ['someDependency', function(someDependency){
    var vm = this;
  }]);

Two Way Data Binding

This is probably the coolest thing about Angular as well as why I really like the MV* structure. Your view is always in sync with the data in your controller!

// state.js

.state('sample', {
	url: '/',
	templateUrl: 'view.html',
	controller: 'someController',
	controllerAs: 'dbc'
});

// controller.js

.controller('someController', ['someDependency', function(someDependency){
    var vm = this;
    
    vm.data = 1;
    vm.addOne = addOne();
    
    function addOne(){
      ++vm.data;
    }
}]);

<!-- view.html -->
<div>
  {{ dbc.data }}
  
  <button ng-click="dbc.addOne()">Add 1!</button>
</div>

---

Prev: States | Next: Services & Factories | Home: Lecture Outline