I am not sure why you were creating some many copies of the service I have simplified your code and I think it should work as you expect:
js
var testModule = angular.module('testmodule', []);
testModule
.controller('QuestionsStatusController1',
['$rootScope', '$scope', 'myservice',
function ($rootScope, $scope, myservice) {
$scope.myservice = myservice;
$scope.myservice.confirming = "asdsadasdd";
$scope.ForceBinding = function(){
$scope.myservice.newValue = $scope.NotBinding;
};
$scope.$watch("NotBinding",
function( newValue, oldValue ) {
$scope.myservice.newValue = newValue;
}
);
$scope.$watch("confirming",
function( newValue, oldValue ) {
$scope.myservice.confirming = newValue;
}
);
}]);
testModule
.controller('QuestionsStatusController2',
['$rootScope', '$scope', 'myservice',
function ($rootScope, $scope, myservice) {
$scope.myservice = myservice;
}]);
testModule
.service('myservice', function() {
this.xxx = "yyy";
});
and html:
<!DOCTYPE html>
<html ng-app="testmodule">
<head>
<script data-require="[email protected]" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div data-ng-controller="QuestionsStatusController1">
1<br> <input ng-model="myservice.xxx" />{{myService.xxx}}<br>
<hr>
2<br> Dynamic Binding : <input ng-model="NotBinding"/><br>
Click to dynamic Bind <input type="button" value="bindNow" ng-click="ForceBinding()" >
<hr>
3<br>Binding directly to the service model<input ng-model="myservice.confirming">
</div>
<hr><hr><hr><hr><hr>
<div data-ng-controller="QuestionsStatusController2">
The value of xxx is: {{ myservice.xxx }}
<hr>
Dynamic Binding Problem Value : {{myservice.newValue}}
<hr>
Direct binding to the service object : {{myservice.confirming}}
</div>
</body>
</html>
<!DOCTYPE html>
<html ng-app="testmodule">
<head>
<script data-require="[email protected]" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div data-ng-controller="QuestionsStatusController1">
1<br> <input ng-model="myservice.xxx" />{{myService.xxx}}<br>
<hr>
2<br> Dynamic Binding : <input ng-model="NotBinding"/><br>
Click to dynamic Bind <input type="button" value="bindNow" ng-click="ForceBinding()" >
<hr>
3<br>Binding directly to the service model<input ng-model="confirming">
</div>
<hr><hr><hr><hr><hr>
<div data-ng-controller="QuestionsStatusController2">
The value of xxx is: {{ myservice.xxx }}
<hr>
Dynamic Binding Problem Value : {{myservice.newValue}}
<hr>
Direct binding to the service object : {{myservice.confirming}}
</div>
</body>
</html>
Check the differences between your code and mine and you'll find what was wrong, for instance the div for the controller 1 was closed before number 3 (that was why it wasn't being updated).
You can see it in this plunkr.
