Day1 gist

day1.js

  angular.module('myApp.services', [])
  .factory('UserFactory', function($http, $q) {
    var service = {
      // our factory definition
      user: {},
      setName: function(newName) { 
        service.user['name'] = newName; 
      },
      setEmail: function(newEmail) {
        service.user['email'] = newEmail;
      }
    };
    return service;
  })
  .service('UserService', function() {
    var self = this; // Save reference
    this.user = {};
    this.backendUrl = "http://localhost:3000";
    this.setName = function(newName) {
      self.user['name'] = newName;
    }
    this.setEmail = function(newEmail) {
      self.user['email'] = newEmail;
    }
    this.save = function() {
      return $http.post(self.backendUrl + '/users', {
        user: self.user
      });
    }
  })
  .provider('User', function() {
    this.backendUrl = "http://localhost:3000";
    this.setBackendUrl = function(newUrl) {
      if (newUrl) this.backendUrl = newUrl;
    }

    // injectables go here
    this.$get = function($http) {
      var self = this;
      var service = {
        user: {},
        setName: function(newName) {
          service.user['name'] = newName;
        },
        setEmail: function(newEmail) {
          service.user['email'] = newEmail;
        },
        save: function() {
          return $http.post(self.backendUrl+'/users',
          {
            user: service.user
          });
        }
      }
      return service;
    }
  });
  angular.module('myApp', ['myApp.services'])
  .config(function(UserProvider) {
    UserProvider
      .setBackendUrl('http://localhost:9000');
  })
  .controller('PageCtrl', 
    function($scope, User) {
      $scope.user = "hi";
  });

here is my take:

1. factory: poor man's one-size-fit-all singleton: it returns an object created inside the factory code
2. service: one-of-a kind singleton: it returns a constructor function, from which a singleton will be created by angularjs. if you know COM, it is very similar: for a "type", a real factory "object" in the form of a javascript function is returned, and the framework call this "factory instance" to create the requested instance of a type/class.
   3.provider: customizable singleton: instead of just return a plain old constructor function, it defines a $get function in the provider function, which returns an object, just like the case of factory. in this case, the final singleton object creation is more refined.

In summary:

factory: give me your POJO object, and I am happy.
service: give me your Contructor function, and angularjs will just new MyService()
provider: give me your provider function, and angularjs will new MyProvide(), and then call $get() on it and then inject the $get() returned object into user code.

here is my take:

1. factory: poor man's one-size-fit-all singleton: it returns an object created inside the factory code
2. service: one-of-a kind singleton: it returns a constructor function, from which a singleton will be created by angularjs. if you know COM, it is very similar: for a "type", a real factory "object" in the form of a javascript function is returned, and the framework call this "factory instance" to create the requested instance of a type/class.
   3.provider: customizable singleton: instead of just return a plain old constructor function, it defines a $get function in the provider function, which returns an object, just like the case of factory. in this case, the final singleton object creation is more refined.

In summary:

factory: give me your POJO object, and I am happy.
service: give me your Contructor function, and angularjs will just new MyService()
provider: give me your provider function, and angularjs will new MyProvide(), and then call $get() on it and then inject the $get() returned object into user code.

And can we mix them together? use factory + provider in service and other scenarios?

And can we mix them together? use factory + provider in service and other scenarios?

Just read the 1st day of ng-cookbook. I found it useful to understand factory, service and provider contepts of AngularJS

Just read the 1st day of ng-cookbook. I found it useful to understand factory, service and provider contepts of AngularJS

You didn't mention the module dependency in the PDF ( line 58 )

You didn't mention the module dependency in the PDF ( line 58 )

Not a huge deal, and maybe not worth the time to fix, but it's probably a pretty well trafficked page, and I personally learned a lot from it.

Line 34 is still showing wrong on the article that links to this.

http://www.ng-newsletter.com/advent2013/#!/day/1

It shows:

if (Url) this.backendUrl = newUrl;

but should be as in this snippet:

if (newUrl) this.backendUrl = newUrl;

And if you're in there fixing stuff, the wrong "two" is used in this sentence. ;-)

Unlike the previous to methods, we'll set the injectables in a defined this.$get() function definition.

Not a huge deal, and maybe not worth the time to fix, but it's probably a pretty well trafficked page, and I personally learned a lot from it.

Line 34 is still showing wrong on the article that links to this.

http://www.ng-newsletter.com/advent2013/#!/day/1

It shows:

if (Url) this.backendUrl = newUrl;

but should be as in this snippet:

if (newUrl) this.backendUrl = newUrl;

And if you're in there fixing stuff, the wrong "two" is used in this sentence. ;-)

Unlike the previous to methods, we'll set the injectables in a defined this.$get() function definition.