AngularJS : basic controller As VM using Provider

AngularJS : basic controller As VM using Provider

by Daan De Smedt

HTML

<div ng-app="app" ng-controller="BasicController as vm">
  Hello, {{vm.movie.title}}!
  <br/> Version : {{vm.movie.version}}
</div>

JavaScript

angular
  .module('app', [])
  .provider('movie', MovieProvider)
  .controller('BasicController', BasicController)
  .config(function(movieProvider) {
    movieProvider.setVersion('Provider version');
  });

function MovieProvider() {
  var version;
  return {
    setVersion: function(value) {
      version = value;
    },
    $get: function() {
      return {
        title: 'The Matrix',
        version: version
      }
    }
  }
}

function BasicController(movie) {
  /* declare VM */
  var vm = this;
  /* set constant to VM */
  vm.movie = movie;
}