迭代循环

这是我的原始plunker演示http://plnkr.co/edit/9UBZ9E4uxAo1TXXghm1T?p=preview。对于div 4（ng-if =“show == 4”）当列表为空时，我想隐藏特定div，当前每个div显示为5秒的时间间隔，任何输入？根据$ interval显示每个div，需要修改js代码以隐藏div如果detailsList==0。迭代循环

JS代码：

app.controller('MainController', function($scope, $rootScope, $interval) { 
    $scope.show = 1; 
    $rootScope.detailsList = 0; 

    $interval(function() { 

    if ($scope.show === 4) { 
     if ($rootScope.detailsList < 2) { 
     ++$rootScope.detailsList; 
     } else { 
     $rootScope.detailsList = 0; 
     $scope.show = 1; 
     } 
    } else if ($scope.show < 4) { 
     ++$scope.show; 
    } else { 
     $scope.show = 1; 
    } 
    }, 5000, 0); 

});

来源

2017-10-17 user8727958

你能提供什么e预期的结果，你正试图实现？ –

@divyareddy - 请查看演示http://plnkr.co/edit/9UBZ9E4uxAo1TXXghm1T?p=preview 在上面的plnkr演示中，$ scope.details长度为零，我不想在加载$ scope.details length时加载div4是零。即使使用了ng-hide，div也会被加载，因为我们使用$ interval来加载每个div。 – user8727958

你想隐藏div ..当你的细节长度为零或detailsList == 0？ – vertika

使用一个开始可变来控制例如$间隔如下面提到

$scope.start = 1 ; // 1 to start and 0 to stop

更新控制器登录与上述启动可变

app.controller('MainController', function($scope,$rootScope, $interval) { 
    $scope.show = 1; 
    $rootScope.detailsList = 0; 
    $scope.start = 1; 

    var intervalPromise = $interval(function() { 

     if($scope.start ==1){ 
     if ($scope.show === 4) { 
      if ($rootScope.detailsList < 2) { 
      ++$rootScope.detailsList; 
      } else { 
      $rootScope.detailsList = 0; 
      $scope.show = 1; 
      $scope.start =0; 
      } 
     } 
     else if ($scope.show < 4) { 
      ++$scope.show; 
     } else { 
      $scope.show = 1; 

       } 

} 
     }, 1000, 0); 




});

来源

2017-10-17 04:13:31

建议的代码似乎不起作用，请查找更新后的plnkr http://plnkr.co/edit/mZRvsFNJY3DRcUhRQrA8?p=preview。它正在加载第一个区间的空div（空白页可以在3333333后显示，当$ scope.detailsList1长度为零时，可以看到空白页。@ divya reddy – user8727958

@ user8727958，你说你想隐藏div时的细节长度是零权利，请找到codepen参考 - https://codepen.io/divyar34/pen/WXRNeV –

好！你不会显示你的div与show==4条件。而是采取另一种变量来显示div标签：

Coontroller：

我已经加入了新的变量showDivFour改变了你的控制器

app.controller('MainController', function($scope,$rootScope, $interval) { 
$scope.show = 1; 
$rootScope.detailsList = 0; 
$scope.showDivfour = false; 

$interval(function() { 
    if ($scope.show === 4) { 

     if ($rootScope.detailsList < 2) { 
     ++$rootScope.detailsList; 
     } else { 
     $rootScope.detailsList = 0; 
     $scope.show = 1; 
     } 
     if($rootScope.detailsList!=0){ 
     $scope.showDivenfour = true; 
     }else{ 
     $scope.showDivenfour = false; 
     } 
    } 
    else if ($scope.show < 4) { 
     ++$scope.show; 
    } else { 
     $scope.show = 1; 
    } 

    }, 5000, 0); 



});

你的HTML：

变化：

<div ng-if="showDivfour" ng-controller="detailsController" > 

    <div > 
     <h1> {{details[detailsList].name}} </h1> 

    </div> 
    </div>

来源

2017-10-17 06:05:52 vertika

请找到更新的代码http://plnkr.co/edit/qDcJ51CunMkWLZj5en9c?p=preview。它正在加载div，然后检查我们给出的条件if（$ scope.show <4）{++ $ scope.show;}。 – user8727958

回答

相关问题