AngularJS, как настроить провайдера между двумя модулями?

Как настроить провайдера между двумя модулями?

Кратко: я пытаюсь обобщить службу и настроить несколько экземпляров немного по-разному.

Прямо сейчас у меня есть куча Angular Services (фабрика), которые я хотел бы обобщить, чтобы их можно было использовать повторно. В моем доказательстве концепции я пытаюсь разбить приложение AngularJS 1.3 на 2 модуля «боб» и «джо». Каждый модуль должен иметь общего провайдера, который должен иметь настраиваемую переменную под названием food. Я пытаюсь определить повторно используемую службу и создать отдельный экземпляр для каждого модуля.

Я прочитал документацию Angular о провайдерах, и, насколько я понимаю, провайдеры позволяют вам извлекать настраиваемую часть в .config(). Что я делаю не так? Я бы ожидал, что еда Боба будет бананом, но еда Джо, которая настроена второй, перезаписывает еду Боба. Это наводит меня на мысль, что поставщик продуктов питания не создает новый экземпляр для каждого из модулей «боб» и «джо».

Я на AngularJS v1.3.15

index.html

<div ng-controller="BobCtrl">Bob's Food: {{ providerInstance.get() }}</div>
<div ng-controller="JoeCtrl">Joe's Food: {{ providerInstance.get() }}</div>

app.js

angular.module('shared').provider('Food', function() {
  var _food = 'Default';  
  this.set = function(food) { _food = food; }

  this.$get = function() {
    return {
      get: function()  {
        return _food;
      }
    }
  };
});

angular.module('bob').config(function(FoodProvider) { 
  FoodProvider.set('Banana');
});
angular.module('bob').controller('BobCtrl', function($scope, Food) {
  $scope.providerInstance = Food;
});

angular.module('joe').config(function(FoodProvider) {
  FoodProvider.set('Apple');
});
angular.module('joe').controller('JoeCtrl', function($scope, Food) {
  $scope.providerInstance = Food;
});