2016-08-11 2 views
0

членов Angular Technorati. Я прихожу к вам с загадочной проблемой, хотя и простой. Мне нужно отключить слой div примерно через 11 секунд и показать еще один слой div. Как это делается с использованием тайм-аута angularjs, предпочтительно внутри контроллера?Как переключить уровни div с функцией таймаута в Angularjs?

Хорошо, что, если бы я объединил шоу и спрятал событие с услугой $ timeou?

` <body ng-app="myApp"> 
<div ng-controller="showHideController" ng-init="getPanel_1()"> 




    <div ng-controller="showHideController" ng-show="divA"style=''> 


</div> 



<div ng-controller="showHideController" ng-show="divB" style=''> 
</div> 
<script> 
angular.module('myApp',[]).controller('showHideController',function($scope, $timeout) { 


    $scope.getPanel_1 = function(){ 
    $scope.divA = true; 
    $scope.divB = false; 
    $scope.divC = false; 
    } 
    $timeout(function(){ 
    $scope.getPanel_1 = function(){ 
    $scope.divA = false; 
    $scope.divB = true; 
    $scope.divC = false; 
    } 
    }, 5000); 
}); 

</script>` 

Спасибо заранее, Batoe.

«Дорога к успеху наполнена препятствиями ...... но и успех!» Неизвестный оптимист.

+0

путем "переключения из" вы имеете в виду изменить 'г-index' встроенный стиль? вы можете использовать 'ngStyle' для https://docs.angularjs.org/api/ng/directive/ngStyle или' ngClass', если у вас есть предопределенные стили https://docs.angularjs.org/api/ng/directive/ ngClass –

+0

Используйте директивы ng-show и покажите/скройте div в соответствии с вашими настройками. –

ответ

0

Не очень angularjs путь, но вы можете:

<div ng-controller="myCtrl"> 
    <div ng-include src="currentDiv"> 
    </div> 
</div> 

<script type="text/ng-template" id="div1.html"> 
    <div ng-controller="panel_1"> 
    </div> 
</script> 

<script type="text/ng-template" id="div2.html"> 
    <div ng-controller="panel_2"> 
    </div> 
</script> 

и в контроллере:

app.controller('myCtrl', function($scope, $timeout) { 
    $scope.currentDiv= "div1.html" ; 

    $timeout(function() { 
     $scope.currentDiv= "div2.html" ; 
    }, 15000); 
}); 
+0

Умный, но он не переключил div. Я думаю, что если я смогу совместить событие show/hide с сервисом $ timeout, это может быть ответ, который я ищу. –

+0

, так что вы хотите какую-то анимацию на div-переключателе? – Luxor001

+0

Да, но я могу сделать это с помощью сервиса Animate или jQuery. Мне просто нужно показать и скрыть начальный слой div примерно через десять секунд. Это единственный период времени в моем приложении, где мне нужно, чтобы это работало. –