If I have some modules which defines the same value object:
var m1 = angular.module('m1', []);
m1.value('test', 'AAA');
var m2 = angular.module('m2', []);
m2.value('test', 'BBB');
Notice m1 and m2 both have the same value test.
Then in the main module, I depend on them two:
var app = angular.module('angularjs-starter', ['m1','m2']);
app.controller('MainCtrl', function($scope, test) {
$scope.test = test;
});
And the HTML is very simple:
<body ng-controller="MainCtrl">
[{{test}}]
</body>
It will show[BBB] in the final page. I can see that the value test of m1 has been overrode by the one of m2.
You can see a live demo here: http://plnkr.co/edit/u7u8p0nYqq9CvNxWKv5G?p=preview
Is there any way to show the values of test both from m1 and m2 in the same page?
In short - no. AngularJS modules form one namespace. If you define 2 values with the same name on 2 different modules only one will be visible during runtime. This applies to any providers, not only values.
This might get addressed in future versions of AngularJS but for now your best option is to prefix your values (and other providers) with a module name.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With