Angular 1.5 component demo

by maciejgurban

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script>
<div ng-app="demoApp" ng-controller="MainController as mainCtrl">
<pre>{{mainCtrl.test}}</pre>
  <button ng-click="mainCtrl.sayHello()">
  say hello!!
  </button>
</div>

JavaScript

var xyzApi = xyzApi || {
	sayHello: function() {
  	return "hey there\n";
  }
};

angular.module('demoApp', [])
	.controller('MainController', MainController)
  .provider('xyzApi', function XyzApiProvider() {
  
  this.$get = function() {
  
  	var xyzApiFactory = {
      otherFunction: function() {
        //$log.log('other function called');
        return 'other function \n';
      }
  	};
    //console.log(xyzApiFactory, xyzApi);
    angular.merge(xyzApiFactory, xyzApi);
    return xyzApiFactory;
  };
});


function MainController(xyzApi) {
	var vm = this;
  vm.test = '';
  
	vm.sayHello = function() {
  	vm.test += xyzApi.sayHello() + xyzApi.otherFunction();
  }
}