如何更新AngularJS中多个控制器的共享服务属性的异步模型更改绑定[？

Question

我有一个在多个控制器之间共享模型的服务。此模型是异步更新的（在插件的回调中）。我遇到了更新模型没有更新几个控制器/视图对上的绑定的问题。我能想到的唯一方法是让每个控制器向服务传递一个包含 $scope.$apply 的回调函数。每当模型更新时，每个回调都会运行。这对我来说似乎真的很乱。有更好的方法吗？

这是我的示例 sn-p，只有 1 个控制器。要记住的重要一点是，在触发更改后，您导航到使用不同控制器共享服务的不同页面（因此不会调用控制器事件来更新 $scope）：

angular.module('myApp', [])

.controller('MyController', ['myServ', function(myServ) {
	var controller = this;
	
	controller.myObject = myServ.myObject;
	
	controller.onChnge = function() {
		myServ.makeChange();
	};
	
}])

.factory('myServ', [function () {
	// Definitions ==============================
	var service = {};
	service.myObject = { value1: 25 };
	
	service.makeChange = function() {
		if (service.myObject.value1 === 25)
			setTimeout(function() { 
				service.myObject.value1 = 10;
			}, 1000);
		else
			setTimeout(function() { 
				service.myObject.value1 = 25;
			}, 1000);
	}
	
	return service;
}])

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
	<div ng-controller="MyController as ctrl">
		Value: {{ ctrl.myObject.value1 }}<br>
		<button ng-click="ctrl.onChange()">Make Change</button>
	</div>
</div>

更新：明确了异步模型更改的来源。删除了一些不需要的代码位。

Answer 1

不确定这是否是最佳解决方案，但我使用 $watch 来做到这一点。

$scope.UserService = UserService;
$scope.$watch('UserService.getCurrentUser()', function (newVal) {
    $scope.currentUser = newVal;
}, true);

编辑

使用 Angular 的 $timeout 而不是 setTimeout 应该注意调用 apply() 以掌握所有异步内容。 https://coderwall.com/p/udpmtq/angularjs-use-timeout-not-settimeout