迭代循環

這是我的原始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

回答

相關問題