将 $scope 用于 $watch 回调是否有意义？

Question

我在我的网站上使用来自Semantic-UI 的弹出组件。

此弹出窗口用于显示来自服务器的错误，因此大多数情况下它是隐藏的。 此弹出窗口附加到我使用ng-show 管理的 div。我需要将我的弹出组件初始化为一个观察者（当我的 div 显示时），因为我的弹出只有在它的附加元素被渲染时才能计算它的位置。

在进行一些测试时，我注意到从 $watch 回调中对 $scope 的修改未应用：

$scope.$watch('shown', function () {
    //console.log('The click is detected')
    jQuery('#smthg').one('click', function () {
        console.log('I come here')
        $scope.shownBis = false //
    }) //*/
})

对以下内容没有影响：

    <p ng-show="shownBis">This should be disappear</p>

(a demo)

我是 Angular 的新手，不了解这种行为，发生了什么以及为什么 Angular 的理念不允许这样做？

Answer 1

您需要调用 $scope.$apply，因为您不再处于角度流中（将流传递给 jQuery）。

将您的更改包装到 $scope.$apply 中的范围变量，如下所示：

$scope.$apply(function() {
    $scope.shownBis = false;
});

工作演示：http://jsfiddle.net/Hojou/UfA22/1/

Answer 2

改用ng-click：

$scope.smthg = function () {
        $scope.shownBis = false;
  };

您的 HTML：

<p ng-show="shown" ng-click="smthg()">Then click here</p>

DEMO

在进行一些测试时，我注意到对 $scope 的修改来自 没有应用 $watch 回调

顺便说一句，您的代码在 $watch 中也存在.one() 的问题，因为每当shown 发生变化并且不调用函数时，它都会附加更多的事件处理程序