angular service not behaving like singleton class. Getting re-initialized from every widget instance

[LalitAgrawala]

Hi

I have created a angular provider to track how many widget instance are getting created in the app.

Here is my service code -

function WidgetCounterService() {
	// Initialize counter variable
    var instantiationCount = 0;

    // Function to increment instantiation count
    function incrementInstantiationCount() {
        instantiationCount++;
    }

    // Function to get instantiation count
    function getInstantiationCount() {
        return instantiationCount;
    }

    // Expose functions to increment and get instantiation count
    return {
        incrementInstantiationCount: incrementInstantiationCount,
        getInstantiationCount: getInstantiationCount
    };

}

I injected the service in the widget like - 

api.controller=function($rootScope, $scope, WidgetCounterService) {
    // Call the function to increment instantiation count
    WidgetCounterService.incrementInstantiationCount();

    // Access the instantiation count
    $scope.instantiationCount = WidgetCounterService.getInstantiationCount();
    console.warn('$scope.instantiationCount', $scope.instantiationCount);
};

since angular service is singleton, I was hoping  that it would hold the counter value but what I found is service's getInstantiationCount is always returning 1. I am not sure why? Any idea how to fix this or any different solution?

Thanks a lot in advance.