AngularJS - 如何在数组长度为零时显示警报并隐藏默认行为

AngularJS - how to show an alert when the length of an array is zero and hide the default behavior?

本文关键字:显示 隐藏 默认 零时 AngularJS 数组      更新时间:2023-09-26

>我正在使用角度,我正在显示一个小加载圆圈,一旦加载内容,它就会消失。 那个圆圈只是一个 CSS 类,我只是在页面加载第一次时从我的 html 调用它,我是这样做的:

实际上圆圈必须类:.circle和圈内.loader......

<div ng-hide="lineItems.length" class="circle">
 <div class="loader"></div>
</div>

正如你在下面看到的,有一个带有if的承诺,它说如果linesItems.length为零,则显示myModal。 一切正常,但加载循环仍然出现,我需要做的是完全删除该.circle,并在达到if内条件后.loader

.then(function(lines) {
  $scope.lineItems = lines;
  if ($scope.lineItems.length === 0) {
   myModal.show();
   console.log('I AMN EMPTY');
  }else {
   loaderAlert.hide();
  }
 }

有人说我必须使用$scope变量,但我不知道该怎么做,我是 Angular 的新手,还有其他方法吗?

当您开始承诺时,设置一个标志以声明您当前正在加载。然后在加载完成后,将标志设置为 false。将其与 ng-class 或 ng-if 一起使用,以使圆的外观有条件。

function doStuff(){
    $scope.loadingIsHappening = true;
    myService.getStuff().then(function(){
       // your processing here
    }).finally(function(){
        $scope.loadingIsHappening = false;
    });
}

.HTML:

 <!-- ng-if removes from DOM, while ng-hide modifies CSS display to none-->
<div ng-if="loadingIsHappening == true" class="circle">
    <div class="loader"></div>
</div>