如何在AngularJS中跟踪$ watch模型更新的来源?

Tom*_*und 11 javascript angularjs angularjs-scope

在我的多用户AngularJS应用程序中,我的范围内有一个模型对象.用户输入和服务器更新可以操纵此模型.

我有一个$ watch观察员来跟踪模型并更新UI.是否可以从我的$ watch函数中确定我的模型更新的来源/原因?没有这个检查,我有反馈循环的问题(例如UI→服务器→UI).

更新:一些代码

控制器:

$scope.elementProperties = { left: 0 };

$scope.$watch('elementProperties.left', function(newVal, oldVal) { changeSelectedElementProperty('left', newVal, oldVal); } );
Run Code Online (Sandbox Code Playgroud)

指示:

angular.module('myapp.ui-editor').directive('myappPropertiesPanel', function () {
    return {
        templateUrl: 'views/ui-editor/myappPropertiesPanel.html',
        restrict: 'A',
        scope: { elementProperties: '=' },

        link: function postLink (scope, element, attrs) {
            scope.$watch('elementProperties.left', function(newVal, oldVal) { console.log('PropertiesPanel change left', newVal, oldVal); } );
        }
    };
});
Run Code Online (Sandbox Code Playgroud)

use*_*443 -1

您应该尝试将用户输入和服务器更新时发生的逻辑解耦。

实现此目的的一种方法是让 $watch 始终更新 UI 模型。在IU方面,使用ng-model和ng-change。例如

<input ng-model="myModel" ng-change="watchMyModel(myModel)">
Run Code Online (Sandbox Code Playgroud)

这样,当您点击 $scope.watchMyModel 函数时,您就会知道更改来自后端。