如何防止觀察者在同一摘要周期內解雇？

Question

我想在我的字符串chartTitle或對象chartOptions任何屬性發生更改時調用函數drawChart() 。

單獨觀看它們很容易：

$scope.$watch('chartTitle', drawChart);
$scope.$watchCollection('chartOptions', drawChart);

但是，我需要一種方法將它們組合成一個$watch的語句（不添加chartTitle作為一個屬性chartOptions 。

如何防止這兩個監視程序在同一摘要周期內觸發。 也就是說，如果我改變都chartTitle和財產chartOptions ，我怎么能防止drawChart被調用兩次？

可能的方法：

• 深入了解chartOptions和chartTitle 。 不幸的是， chartOptions是一個非常大且復雜的對象，因此，對這些屬性進行深入監視是不可行的。 可以限制深度嗎？

• 檢測在chartOptions守望者是否chartTitle已經消化此周期中被改變，反之亦然。 這有可能嗎？

• 找出一個監視表達式，該表達式將捕獲chartOptions和chartTitle所有屬性。

Answer 1

您可以進行深入了解：

$scope.$watch(
    function() {
        return {
            chartTitle: $scope.chartTitle,
            chartOptions: $scope.chartOptions
        };
    },
    function(newval) {
        ...
    },
    true // deep watch
);

密切關注性能問題，它將在每個摘要周期創建一個對象。 通常這並不重要，但是對於重量級的應用程序則可能如此。

Answer 2

將chartTitle和chartOptions組合到一個對象中，然后對該對象執行$watchCollection 。

$scope.$watchCollection(function() {
    // Make a shallow clone of all the properties in chartOptions
    var amalgam = {};
    for (var key in $scope.chartOptions) {
        var val = $scope.chartOptions[key];
        amalgam[key] = val;
    }

    // Add the chart title to our shallow clone
    amalgam.chartTitle = $scope.chartTitle;
    return amalgam;
}, drawChart);

請注意，這可能不是很快，因為每個摘要周期都在創建一個新對象。