Automatically updating client-side values in AngularJS using setInterval()

Implementing a value calculator on the client side using AngularJS. I need to update the main value of the calculator every 5 minutes with setInterval().

This is my AngularJS code:

 $http({method: 'GET', url: '../assets/sources.json'}).success(function(data)
   {
      $scope.values = data; // response data

      $scope.getSourceValue = function(){

         if ($scope.source == "test") {

            return $scope.values.test["last"]

         } else if ($scope.source == "test"){

            return $scope.values.test1["last"]

         } else if ($scope.source == "test2"){

            return $scope.values["test2"]["last"]

         } else {

            return -1
         };

      } // getSource
    } 

In the client side:

<strong><h1> {{getSourceValue()|currency}}</strong></h1>

Any guidance would be greatly appreciated.

Thank you in advance.

UPDATE:

{
    "timestamp": "Sun Sep 14 2014, 01:40:03",
    "bitstamp": {
        "display_URL": "http://www.bitstamp.net",
        "display_name": "Bitstamp",
        "currency": "BTC",
        "last": 477.6
    },
    "btc-e": {
        "display_URL": "http://www.btc-e.com",
        "display_name": "BTC-e",
        "currency": "BTC",
        "last": 471.5
    },
    "bitcoinaverage": {
        "display_URL": "http://api.bitcoinaverage.com",
        "display_name": "BitcoinAverage",
        "currency": "BTC",
        "last": 479.23
    },
    "geeklab": {
        "display_URL": "http://ws.geeklab.com.ar",
        "display_name": "Geeklab",
        "currency": "ARS",
        "blue": 14.35
    }
}

Answer №1

Here's the solution I came up with for someone else. In this approach:

angular.module('test', [])

   .controller('test', function($scope, $http, $filter, $interval) {



      var stop;

      if(!angular.isDefined(stop)) {
         stop = $interval(function(){


               $http({method: 'GET', url: '../assets/sources.json'}).success(function(data)
               {
                  $scope.values = data; // response data

                  $scope.svalue = 0;

                  $scope.getSourceValue = function(){

                     if ($scope.source == "bitcoinaverage.com") {

                        $scope.svalue = $scope.values.bitcoinaverage["last"]

                     } else if ($scope.source == "bitstamp.net"){

                        $scope.svalue = $scope.values.bitstamp["last"]

                     } else if ($scope.source == "btc-e.com"){

                        $scope.svalue = $scope.values["btc-e"]["last"]

                     } else {

                        $scope.svalue = -1
                     };

                  } // getSource


            });//  /success()


         }, 40000);
      }


}); /*Controller*/

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

One method to preserve the JSON response from geocoding is to store it in a JSON file using libcurl in the

I am currently using geocoding to obtain the latitude and longitude of an address by utilizing libcurl functions. The process is functioning properly, and the program displays the JSON response in the Ubuntu terminal. However, I am unsure about how to util ...

I am unable to retrieve dynamic data from the database

Storing data in a MySQL database has been successful for me. I've been utilizing PDO in PHP to fetch the data and then converting it to JavaScript using json_encode. However, I keep encountering the output NaN when implementing a specific scenario. It ...

Employing JavaScript to set a variable that changes dynamically

In my code, I have a functionality that allows for changing different dropdowns with similar ending IDs. In other parts of the code, I have assigned variables rl and rl_extra as well as rs and rs_extra. Now, when the var prefix is determined to be either ...

Separate angular structure into various sections

I am developing a form builder using Angular dynamic form functionality. The form data is loaded from a JSON object, as shown below: jsonData: any = [ { "elementType": "textbox", "class": "col-12 col-md-4 col-sm-12", "key": "first_ ...

The embedded iframe on YouTube is displaying the incorrect video

I am currently designing a website and I want to feature a video on the homepage. The video is hosted on YouTube and I need to embed it into my website. <html> <iframe width="560" height="315" src="https://www.youtube.com/embed/spPdelVEs_k?rel= ...

Express Angular Node Template Render throwing an error: module 'html' not found

I am currently in the process of creating a web application using AngularJS with ui-router for routing via $stateProvider, ensuring that only the specified states are displayed in the ui-view. In my server.js file, I have set up an initial framework such ...

The interconnected nature of multiple asynchronous tasks can lead to a render loop when relying on each other, especially when

My asynchronous function fetches data in JSON format from an API, with each subsequent call dependent on the previously returned data. However, there are instances where I receive null values when trying to access data pulled from the API due to the async ...

Refreshing a webpage post initial loading using Next.js

Having trouble with my checkout route ""./checkout"" that displays embedded elements from Xola. The issue arises when using client-side routing as the checkout page requires a manual refresh to load correctly and show the Xola elements on the DOM ...

Encountered a problem while trying to retrieve JSON data from Cassandra DB using Java and sparkSession

I am currently working on a project that involves reading data from a Cassandra table using Java with sparkSession. The goal is to format the output as JSON. Here is the structure of my database: CREATE TABLE user ( user_id uuid, email ...

Retrieve distinct values for the keys from an object array in JavaScript

Here is the structure of my array: const arr1 = [ { "Param1": "20", "Param2": ""8", "Param3": "11", "Param4": "4", "Param5": "18", ...

Interact with Node.js server to fetch JSON data from Python and display it on an HTML client using Ajax

Seeking a way to retrieve JSON data in my HTML page using Ajax, I have a Node.js server set up for handling requests. The JSON data is generated by Python code on the server. Is it worth saving the JSON in a database for access? Seems overly complicated ...

Looking for a feature where users can easily update their profile using an interactive edit button

I'm currently working on a website project and one of the features I'm tackling is the user's profile page. My objective is to create an edit button within the page that allows the user to modify their name, username, email, and update their ...

Sending the image's identification number as a parameter to a function and showing the total number

On a static page, I have the following HTML markup: <div class="middle-content"> <div class="white-div"> <div class="like-buttons"> <img id="1" src="up.png" onclick="onClick(true, this.id)" /> &l ...

Automatically adjust multiple images on an HTML webpage

Just starting out with html programming here. Looking to add top margin using a span class, any tips on how to tackle this issue? ...

What can Cordova and express js bring to the table together?

I'm feeling pretty lost when it comes to displaying express views in a Cordova app client. It seems like the app would have to send a GET request and then the express application would render the view. But I'm unsure about how to actually make t ...

Filter numbers within an Array using a Function Parameter

I'm currently experimenting with Arrays and the .filter() function. My goal is to filter between specified parameters in a function to achieve the desired output. However, I'm encountering an issue where my NPM test is failing. Although the outpu ...

If the condition is not satisfied, decrease the number of loop iterations

There is a code snippet below: for (var i = 0; i < data.status.length; i++) { if(data.status[i].isMode == 0) { var row = '<tr><td>' + data.status[i].Name + '</td><td>' + data.status[i].Pay + &apos ...

What is the best way to run this command in Python?

I could really use some assistance in understanding how to execute the command below using Python: curl -X POST -H "Content-Type: application/json" -H "X-Insert-Key: YOUR_KEY_HERE" -d '{"eventType":"Custom Event Name", "attribute1": "value"}' ...

How can I obtain the model values for all cars in the primary object?

const vehicles={ vehicle1:{ brand:"Suzuki", model:565, price:1200 }, vehicle2:{ brand:"Hyundai", model:567, price:1300 }, vehicle3:{ brand:"Toyota", model ...

Displaying object properties within another object obtained from an API request in a React component

Dealing with API data can be tricky, especially when there are nested objects involved. I've encountered an error message stating 'undefined is not an object (evaluating 'coin.description.en')', as the description property of the c ...