javascript - 在 angularjs 中显示 div 不起作用

Question

我想仅在函数发生时显示 div。

这是 HTML，但它总是显示，我希望它仅在函数为 true 时显示

<div ng-controller="controller">
    <div ng-show="data.show"> Successfully triggered </div>
    <div ng-hide="!(data.hide)"> Error in triggering</div>
</div>

在 Controller 中我有:

if(results.data=='success') {
    $scope.data = {
        show: false,
        hide: true
    }; 
    //Here I should display the success message
} else {
    //Here I should display the error message
}

那么，如何在 if 条件中显示成功 div 并在 else 条件中显示错误 div 。

注意:如果可能的话，如果 div 以慢动作显示，这对我来说会非常有帮助。就像 jQuery 中的淡入淡出时间一样。

Answer 1

您应该只维护一个足以显示隐藏 div 的标志 data.show。

<div ng-controller="controller">
    <div ng-show="data.show"> Successfully triggered </div>
    <div ng-hide="data.show"> Error in triggering</div>
</div>

Controller

app.controller('myCtrl', function(){

   ///other stuff here ..


   $scope.myFunction = function(){
       if(results.data=='success') {
          $scope.data.show = true; //success
       } else {
          $scope.data.show = false; //error
       }
    }

    //init code here
    $scope.data = { show: false }; //this should be outside your show/hide function 

})