javascript - ng-show 和 ng-hide 在几分之一秒内不起作用

Question

在我的应用程序中，我有两个 div 属性，我想根据状态(state1 或 state2)显示它们。第一个 div1 包含一个按钮，当点击它时转换到 state2(div1 消失，div2 出现)。

 <div id="state1" ng-show="firstMode"><button ng-click="goTo2()">Go</button></div>
 <div id="state2" ng-hide="firstMode"><button ng-click="goTo2()">Go</button></div>

// Controller 逻辑

$scope.firstMode = true
$scope.goTo2 = function() {
     $scope.firstMode = false
}

在移动设备上查看时，两个 div 在实际状态开始之前会显示几分之一秒。单击按钮转换到 state2 时也会发生同样的情况。加载 View 时基本上会发生以下情况:

已显示 div1 和 div2

div1 显示，div2 隐藏

点击按钮(显示div2，隐藏div1)

已显示 div1 和 div2

div2 显示，div1 隐藏

如何防止这种困惑的 View 转换和加载？

Answer 1

根据您对问题的描述，您可能加载了 ngAnimate，并且您的样式表有一些默认的 css 转换。要验证，请尝试添加:

app.run(function($animate){
    $animate.enabled(false);
})

到你的运行函数。这将全局禁用动画。如果问题消失，您可以删除并开始尝试找出您的“流氓”css 转换在哪里。