Question

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

此弹出窗口用于显示服务器的错误，因此大部分时间都是隐藏的。此弹出窗口附加到我使用ng-show管理的div。我需要将我的弹出组件初始化为观察者（当我的div显示时），因为我的弹出窗口只有在渲染其附加元素时才能计算其位置。

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

$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

请尝试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发生变化且没有调用该函数，会附加更多事件处理程序

Answer 2

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

将更改换行到$ scope中的范围变量。$ apply如下：

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

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

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

2 个答案: