Angular Singletons And Factories

A small proof to myself of how angular factories work. Depending on your style, you could call new in the controller or call new in the factory, then create another singleton that creates the object as shown here... https://docs.angularjs.org/guide/providers

by jrab227

HTML

<div ng-app="application">
    <div ng-controller='mod1Controller as c'>
        {{c.data}}
    </div>
    <div ng-controller='mod2Controller as d'>
        {{d.data}}
    </div>
</div>

JavaScript

//My service registry for a provider
var serviceRegistry = angular.module('serviceRegistry', [])
.provider('coolService', function coolServiceProvider(){
    var self = this
    this.type = undefined
    this.$get = function(){
        return { data: self.type }
    }
        
})

//A module that uses a dependent service
var mod1 = angular.module('mod1', ['serviceRegistry'])
.config(['coolServiceProvider', function(coolService){
    coolService.type = "foo" //In this module I want foo type
}])
.controller('mod1Controller', ['coolService', function(coolService){
	this.data = coolService.data //Standard data binding
}])

//A second module that uses a dependent service
var mod2 = angular.module('mod2', ['serviceRegistry'])
.config(['coolServiceProvider', function(coolService){
    coolService.type = "bar" //In this module I want bar type
}])
.controller('mod2Controller', ['coolService', function(coolService){
	this.data = coolService.data //Standard data binding
}])

var myApp = angular.module('application', ['mod1', 'mod2'])