mritzco · August 7, 2014 10:15
diff --git a/jsbin.malew.html b/jsbin.malew.html
 <!DOCTYPE html>
 <html ng-app="app">
 <head>
 	<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
 	<meta charset=utf-8 />
 	<title>JS Bin</title>
 </head>
 <body ng-controller="MyCtrl">
 	{{serviceOutput}} -
 {{name}}-
 	<br/><br/>
 	{{factoryOutput}}
 	<br/><br/>
 	{{providerOutput}}
  
  <hr />
  Some sources:
  <ul>
    <li>Based on : http://jsbin.com/ohamub/1/edit</li>
    <li>https://docs.angularjs.org/api/auto/service/$provide</li>
    <li>http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory</li>
    <li>https://groups.google.com/forum/#!msg/angular/56sdORWEoqg/HuZsOsMvKv4J</li>
    <li>http://blog.xebia.com/2013/09/01/differences-between-providers-in-angularjs/</li>
  </ul>
 	<script>

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

 		var MyFunc = function() {

 			this.name = "default name";
            
            
 			this.$get = function() {
                if (this.name == "default name") this.name = "new name"
 				return "Hello from MyFunc.$get(). this.name = " + this.name;
 			};
               
 			return "Hello from MyFunc(). this.name = " + this.name;
 		};

 		// returns the actual function
 		app.service( 'myService', MyFunc );

 		// returns the function's return value
 		app.factory( 'myFactory', MyFunc );

 		// returns the output of the function's $get function
 		app.provider( 'myProv', MyFunc );
      
      //Comment the next lines to run provider without config
      app.config(function (myProvProvider) {
        myProvProvider.name = "Configured name";
      });
      
 		function MyCtrl( $scope, myService, myFactory, myProv ) {

 			$scope.serviceOutput = "myService = " + myService;
          $scope.name = myService.name;
 			$scope.factoryOutput = "myFactory = " + myFactory;
 			$scope.providerOutput = "myProvider = " + myProv;

 		}

 	</script>
  
 </body>
 </html>
	<!DOCTYPE html>
	<html ng-app="app">
	<head>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
	<meta charset=utf-8 />
	<title>JS Bin</title>
	</head>
	<body ng-controller="MyCtrl">
	{{serviceOutput}} -
	{{name}}-
	<br/><br/>
	{{factoryOutput}}
	<br/><br/>
	{{providerOutput}}

	<hr />
	Some sources:
	<ul>
	<li>Based on : http://jsbin.com/ohamub/1/edit</li>
	<li>https://docs.angularjs.org/api/auto/service/$provide</li>
	<li>http://stackoverflow.com/questions/15666048/angular-js-service-vs-provider-vs-factory</li>
	<li>https://groups.google.com/forum/#!msg/angular/56sdORWEoqg/HuZsOsMvKv4J</li>
	<li>http://blog.xebia.com/2013/09/01/differences-between-providers-in-angularjs/</li>
	</ul>
	<script>

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

	var MyFunc = function() {

	this.name = "default name";


	this.$get = function() {
	if (this.name == "default name") this.name = "new name"
	return "Hello from MyFunc.$get(). this.name = " + this.name;
	};

	return "Hello from MyFunc(). this.name = " + this.name;
	};

	// returns the actual function
	app.service( 'myService', MyFunc );

	// returns the function's return value
	app.factory( 'myFactory', MyFunc );

	// returns the output of the function's $get function
	app.provider( 'myProv', MyFunc );

	//Comment the next lines to run provider without config
	app.config(function (myProvProvider) {
	myProvProvider.name = "Configured name";
	});

	function MyCtrl( $scope, myService, myFactory, myProv ) {

	$scope.serviceOutput = "myService = " + myService;
	$scope.name = myService.name;
	$scope.factoryOutput = "myFactory = " + myFactory;
	$scope.providerOutput = "myProvider = " + myProv;

	}

	</script>

	</body>
	</html>