Почему мои свойства сервиса не обновляются?

Question

На мой взгляд, я привязываюсь к свойству службы, что свойство службы привязано к другому свойству службы.

Проблема заключается в том, что ни одно свойство службы не обновляется, когда я изменяю его в представлении. Может ли кто-нибудь пролить свет, пожалуйста?

Вот plunker: http://plnkr.co/edit/D0YMzD?p=preview

Контроллер:

myApp.controller('Ctrl', ['$scope', 'serviceOne', function($scope, serviceOne) { 

    var ctrl = this; 

    ctrl.val = serviceOne.val; 

    $scope.$watch(function() { 
     return ctrl.val; 
    }, function() { 
     console.log('ctrl says val=' + ctrl.val); 
    }, true); 

}]); 

serviceOne:

myApp.service('serviceOne', ['serviceTwo', '$rootScope', function (serviceTwo, $rootScope) { 

    var sOne = this; 

    sOne.val = serviceTwo.val; 

    $rootScope.$watch(function() { 
     return sOne.val; 
    }, function() { 
     console.log('sOne says val=' + sOne.val); 
    }, true); 

}]); 

serviceTwo:

myApp.service('serviceTwo', ['$rootScope', function ($rootScope) { 

    var sTwo = this; 

    sTwo.val = "hello"; 

    $rootScope.$watch(function() { 
     return sTwo.val; 
    }, function() { 
     console.log('sTwo says val=' + sTwo.val); 
    }, true); 

}]); 

Answer 1

Это «всегда есть точка в вашей модификация эль ". Вы передаете строки, а не ссылки на объекты. Это работает:

var myApp = angular.module('myApp', []); 

myApp.controller('Ctrl', ['$scope', 'serviceOne', function($scope, serviceOne) { 

    var ctrl = this; 

    ctrl.val = serviceOne.val; 

    $scope.$watch(function() { 
     return ctrl.val; 
    }, function() { 
     console.log('ctrl says val=' + ctrl.val.s); 
    }, true); 

}]); 

myApp.service('serviceOne', ['serviceTwo', '$rootScope', function (serviceTwo, $rootScope) { 

    var sOne = this; 

    sOne.val = serviceTwo.val; 

    $rootScope.$watch(function() { 
    return sOne.val.s; 
    }, function() { 
    console.log('sOne says val=' + sOne.val.s); 
    }, true); 

}]); 

myApp.service('serviceTwo', ['$rootScope', function ($rootScope) { 

    var sTwo = this; 

    sTwo.val = { s: "hello" }; 

    $rootScope.$watch(function() { 
    return sTwo.val.s; 
    }, function() { 
    console.log('sTwo says val=' + sTwo.val.s); 
    }, true); 

}]); 

и соответствующее изменение в шаблоне:

<div ng-controller="Ctrl as ctrl"> 
     <input ng-model="ctrl.val.s"></input> 
</div>