AngularJS - Injeção em controllers

bY: Suissa

by Francis Rodrigues

HTML

<html ng-app="myApp">
  <head></head>
  <body>
    <section ng-controller="AppCtrl">
      <h1>Ola, {{name}}</h1>
      <div>
        <label for="name">Meu nome é</label>
        <input name="name" ng-model="name" type="text"/>
      </div>
      <br/>        
      <button ng-click="reverseNameByService()">Reverse Name via Service</button>
      <button ng-click="reverseNameByFactory()">Reverse Name via Factory</button>
    </section>
  </body>
</html>

JavaScript

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

app.controller( 'AppCtrl', function AppCtrl($scope, nameReverseService, nameReverseFactory) {
  $scope.name = 'Suissa';
  $scope.reverseNameByService = function() {
    $scope.name = nameReverseService.reverse($scope.name);  
  };
  $scope.reverseNameByFactory = function() {
    $scope.name = nameReverseFactory.reverse($scope.name);  
  };
});

app.service('nameReverseService', function() {
  this.reverse = function(name) {
    return name.split("").reverse().join("");
  };
});

app.factory('nameReverseFactory', function() {
  return {
    reverse : function(name) {
      return name.split("").reverse().join("");
    }
  }
});