javascript - "Ghost"ng点击功能

标签 javascript angularjs angularjs-digest

正当我自以为对 Angular 相当了解的时候,我遇到了这样的情况:

有人可以解释这是怎么可能的吗?

演示: http://jsfiddle.net/u08jgd4g/1/

HTML

<div ng-controller="MyCtrl">

  <button ng-click="WTF" ng-bind="labelText()"></button>

  <div ng-show="showMe()">
    Hello, World!
  </div>

</div>

JS

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {

    var show = true;

    $scope.labelText = function() {
        return !show ? 'Hide' : 'Show';
    };

    $scope.showMe = function() {
        show = !show;
        return show;
    };

};

如果您还没有发现问题:该按钮有一个不存在的 ng-click 函数,但是当您单击该按钮时,div 切换并且按钮值发生变化.

最佳答案

这不是因为该函数不存在,而是因为该点击触发了 $digest 循环。因此循环运行并评估您的 ngShowngBind 函数。

这 2 个函数只是简单地将一个变量翻转到与原来相反的位置,然后应用结果。因此,所发生的一切就是触发摘要循环并触发 View 中绑定(bind)的函数。

关于javascript - "Ghost"ng点击功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34615709/

相关文章:

javascript - Angular.js 中是否有任何事件 "on $scope digest finished"或 "on view refreshed"?

javascript - Angular - 无限 $digest 循环

javascript - 移动导航在滚动时消失

javascript - 在 spring Controller 中使用 angularJs $http 将对象作为 json 键发送返回 null

javascript - 如何让我的滑动条通过刷新保持位置

javascript - 如何使用 dom id 将普通 JavaScript keyup 监听器附加到 Angular md-autocomplete 输入?

javascript - 用相同的类包裹相邻的元素

javascript - 由于在 url 中附加参数, Controller 被调用两次

angularjs - UI 路由器导航到父状态更改查询字符串参数

javascript - 如何通过 D3 单击事件让 $rootScope.$emit() 和 ng-show 协同工作?