ng-class 何时结束表达式评估并应用该类？答案

【问题标题】：When does ng-class ends expression evaluation and applies the class?ng-class 何时结束表达式评估并应用该类？
【发布时间】：2017-01-25 13:49:49
【问题描述】：

我正在尝试实现类似于全屏模式的功能：使用一个按钮触发全屏模式，然后使用另一个按钮返回。

主题：

 <div ng-class="{full: !presentationMode}"> 
     <div id="child-div>content</div> //div has 100% height
 </div>

触发器： <button ng-click="present()">Click me!</button>

在控制器中我这样做：

$scope.present = () => {
            $scope.presentationMode = !$scope.presentationMode;
            var myDiv = angular.element('#container');

            // when $scope.presentationMode is true
            // myDiv.height() is not the height set by the "full" class, but it is always reversed (the previous value) 

            // It !sometimes! work if I use $timeout.
 }

我应该如何处理这种情况？

这是一个小提琴：https://jsfiddle.net/U3pVM/29641/

【问题讨论】：

标签： javascript angularjs angularjs-scope ng-class

【解决方案1】：

你有一个语法：

<div ng-class="{full: !presentationMode}">

你的班级名称应该在' '中

<div ng-class="{'full': !presentationMode}">

【讨论】：

没有帮助。如果类名不包含破折号也没关系！

【解决方案2】：

实际上似乎存在范围摘要循环问题：我试图在应用类之前访问 div 的高度，所以这就是为什么我总是得到以前的（高度）值。

解决方案是在 $timeout 的函数中获取 div 的高度，没有延迟，但是将 invokeApply 设置为 false（默认为 true）。

$timeout(function() {
    console.log(myDiv.height()); //has correct value
}, 0, false);

【讨论】：