Home angularjs $interval only executes once when called twice
Reply: 0

angularjs $interval only executes once when called twice

user4522
1#
user4522 Published in April 25, 2018, 7:45 pm

Index.html

<!DOCTYPE html>
<html ng-app="bitExchange">
<head>
  <title>BTC exchanges</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<div ng-controller="timeCtrl as ctrl" >
    <p id="toggleColor">{{ctrl.now}}</p>
    <p id="bitfinexToggle">{{ctrl.finexnow}}</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
<script src="testcolor.js"></script>
<script src="btc-data-factory.js"></script>
</html>

app.js

angular
.module('bitExchange',[])
.controller('timeCtrl',['bitDataFactory', '$scope', '$interval', function(bitDataFactory,$scope,$interval){
    vm = this;
    vm.prev = 12690;
    vm.now;
    $interval(function(){
        bitDataFactory.bittrexUSD().then(function(response){
            $scope.bittrexUSD = response.data.result[0];
            vm.now = response.data.result[0].Ask;
            $scope.diff1 = $scope.bittrexUSD.Last - $scope.bittrexUSD.PrevDay;
            $scope.diff2 = $scope.bittrexUSD.Last + $scope.bittrexUSD.PrevDay;
            $scope.diff3 = $scope.diff2 / 2;
            $scope.diff4 = $scope.diff1 / $scope.diff3;
            $scope.finalDiff = $scope.diff4 * 100;
        console.log(vm.now)
        }).catch(function(error){
            console.log(error.statusText);
        });
    }, 10000);

    var el = document.getElementById('toggleColor');
    $scope.addClassRed = function() {
    el.classList.remove("green");
    el.classList.add("red");
    }
    $scope.addClassGreen = function() {
        el.classList.remove("red");
        el.classList.add("green");
    }

    function bittrexInterval(){
        if(vm.now > vm.prev){
            console.log("bittrex"+vm.now+"+");
            vm.prev = vm.now;
            $scope.addClassGreen();
        }else if(vm.now < vm.prev){
            console.log("bittrex"+vm.now+"-");
            $scope.addClassRed();
        }
        }

        function bitFinexInterval(){
            if(vm.finexnow > vm.finexprev){
                console.log("Bitfinex"+vm.finexnow+"+");
                vm.finexprev = vm.finexnow;
                $scope.addClassGreenfinex();
              // $scope.setBlue();
            }else if(vm.finexnow < vm.finexprev){
                console.log(vm.finexnow+"-");
                $scope.addClassRedfinex();
             //  $scope.setRed();
            }
            }

    $interval(function(){
        bittrexInterval();
        bitFinexInterval();
    }, 12000,0 , true)

    vm = this;
    vm.finexprev = 12690;
    vm.finexnow;
    $scope.class = "red";
    $interval(function(){
        bitDataFactory.bitFinexUSD().then(function(response){
            $scope.bitfinex = response.data;
            vm.finexnow = $scope.bitfinex[2];
            $scope.percent = $scope.bitfinex[5]*100;
            $scope.percent2 = $scope.percent.toFixed(2);
            $scope.outPrice = vm.finexnow;
        }).catch(function(error){
            console.log(error.statusText);
        });
    }, 9000);

    var el = document.getElementById('bitfinexToggle');
    $scope.addClassRedfinex = function() {
    el.classList.remove("green");
    el.classList.add("red");
    }
    $scope.addClassGreenfinex = function() {
        el.classList.remove("red");
        el.classList.add("green");
    }
    }])

style.css

.green{
    background: #bce2bc;
    color: #fff;
    padding: 1px 15px;
    border-radius: 4px;
    animation: background-fade 5s forwards;
}

.red{
    background: #eac3c3;
    color: #fff;
    padding: 1px 15px;
    border-radius: 4px;
    animation: background-fade 5s forwards;
}

the output should change colours of 2 divs but only does of last one. only in 1st execution is the bitFinexInterval() executed then it is simply skipped.

Also i am using some datafactories but that wont be nessacary. All i want is to show "red" or "green" based on comparision. But It shows only the second div's not first one.

Please help thank you

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.30286 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO