Save the promise object from the $http GET request in a local storage

Struggling to wrap my head around how to update data on a graph without the proper Angular service knowledge. All I want is to retrieve a JSON object with one GET request and save it locally on my controller. This way, I can use the original JSON to display the initial chart and a modified version based on user input for an updated view. Below is the code snippet from my controller:

`

angular.module('scattChartApp')
.controller('ChartCtrl', function($scope, $http, $cacheFactory) {

  $http.get('chartConfig.json').success(function(response) {
    $scope.options = response.options;
    $scope.data = response.data;
    $scope.initData = angular.copy($scope.data);
  });

  $scope.update = function(user){
    var a, b, c, d, e;
    a = user.a; b = user.b; c = user.c; d = user.d; e = user.e;
    var data = $scope.data;
    if(a !== "" && b !== "" && c !== "" && d !== "" && e !== ""){
      for(var i = 0; i<$scope.data.length; i++){
          for(var j = 0; j<$scope.data[i].values.length; j++){
              var x = $scope.data[i].values[j].x;
              var y = $scope.data[i].values[j].y;
              var z = $scope.data[i].values[j].size;
              data[i].values[j].x = a*x + b*y;
              data[i].values[j].y = c*x + d*y;
              data[i].values[j].size = e*e*z;
          }
      }
      $scope.$apply();
    }
  };

  $scope.reset = function(){ 
    $scope.user = {};
    $scope.data = angular.copy($scope.initData);
    $scope.$apply();
  }; 

});`

Having issues with continuity in the scaling process when using this Plunker (input proper values and click update): http://plnkr.co/edit/n4bDl7LYoylW5tWbRA6g?p=preview

Answer №1

If you remove the $scope.$apply(), it should fix the issue.

Since all the functions being used in this context are from AngularJS, there is no need to include $scope.$apply(). In fact, including it may be causing your application to crash and that could explain why it's only working once.

For more information on $scope.$apply(), you can visit AngularDoc

Edit: If necessary, make sure to check if the plugin option refreshDataOnly is set to false.

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

Do I need to include the title, html, and head tags in a page that is being requested via ajax

I have a page called welcome.htm that is being loaded into another page using ajax. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xh ...

How do I ensure that the default camelCase JsonNamingPolicy is enforced when serializing data in System.Text.Json?

I am facing a frustrating issue where, whenever I include a custom JSON converter, the naming policy is not followed correctly when deserializing properties. It always defaults to PascalCase no matter what. Even with a basic Web API using .NET 6, I can re ...

What is the correct way to establish a Cookie (header) using XMLHttpRequest in JavaScript?

I am attempting to set a cookie in an XSS request using XMLHttpRequest. After reviewing the XMLHttpRequest Specification, I discovered that section 4.6.2-5 indicates that setting certain headers like Cookie and Cookie2 may not be allowed. However, I am lo ...

Using jQuery to import an XML node into a document asynchronously

function generateNewMonth(month, year, table) { "use strict"; var url, updatedTable; url = 'newdata.php?m=' + month + '&y=' + year; $.ajax({ type: 'GET', cache: false, url: url, ...

Is it possible to fire a Socket.io emit with a scroll event?

Can you trigger an emit on a gesture or scroll event, similar to how it works on a click event? I'm trying to create something like this: https://www.youtube.com/watch?time_continue=38&v=tPxjxS198vE Instead of relying on a click, I would like to ...

Is there a way to enhance the Download File dialog with an additional option?

I want to develop an extension for a specific file type, and I'm interested in including a "Send to MyAddonName" feature in the download file dialog, alongside the "Open with" and "Save file" options. Just to clarify, I don't mean the Download Ma ...

What is the best way to eliminate a trailing backslash from a string?

Currently, I am iterating through a list of Discord server names in node.js. The goal is to create a php file that contains an array structured like this: <?php $guildLookup = array( "164930842483761" => "guildName1", "56334 ...

Received an unexpected character '?' in NextJS

After setting up a fresh installation of Ubuntu 22.04.1 LTS and installing npm and docker, I encountered an issue while trying to start my NextJS web server with the command npm run dev. An error message appeared as follows: niklas@srv-code01:~/Desktop/Co ...

Incorporating react-intl-tel-input into your project: A step

Greetings, I am currently delving into the realm of ReactJS and am tasked with incorporating react-intl-tel-input to capture phone numbers from around the globe. However, during the integration process, I encountered some obstacles. When I input this code: ...

Troubleshooting JavaScript Integration in PHP Scripts

I'm currently working on creating an advertisement switcher that can display different ads based on whether the user is on mobile or desktop. I've tried inserting PHP includes directly into the code, and while it works fine, I'm struggling t ...

Tips for centrally zooming responsive images without altering their dimensions

I have created a custom jQuery and CSS function that allows an image to zoom in and out on mouseover while maintaining a constant box size. I modified an example code to suit my needs. Check out the demo here: https://jsfiddle.net/2fken8Lg/1/ Here is the ...

Monitoring the content of a page with jQuery and adjusting the size as needed

Here is a code snippet: function adjustContainerHeight() { $('div#mainContainer').css({ 'min-height': $(document).height() - 104 // -104 compensates for a fixed header }).removeShadow().dropShadow({ 'blur&a ...

Utilize IntelliJ's TypeScript/JavaScript feature to extract a method from all instances

I am relatively new to using IntelliJ Idea Ultimate 2020 and I am currently exploring the refactoring functionalities within the software. Is there a way to extract a method from a section of code and apply it to all instances easily and exclusively withi ...

The Ember.run.throttle method is not supported by the Object Function as it does not have a throttle method within the Ember.Mixin

I have a controller that has an onDragEvent function: controller = Em.Object.create( { onDragEvent: function() { console.log("Drag Event"); } }); Additionally, I have a Mixin called 'Event': Event = Ember.Mixin.create( { at ...

What is the best way to deserialize a JSON document from std::map in C++ using Delphi?

I received a JSON string from C++ which looks like this: "{"name":"mark","data":[1,2,3,4],"some":"11.1":"Hello","22.2":",&","44.4":"World"}}" Unfortunately, when trying to deserialize this JSON string using mormot in Delphi, it failed as I lacked an appr ...

Encountering difficulty retrieving a JSON array from a URL using Java

I am working with a servlet that emits a JSONArray, similar to a REST API. Despite following some guides and attempting to parse the URL, I'm struggling on how to actually do it. I've been successful in receiving the URL and printing it from my c ...

How to monitor and respond to HTML modifications in a child component from a parent component in Angular framework

In the setup I have, there is a main component known as @Component({ selector: 'parent-comp' template: '<child-comp [inputData]="responseData"></child-comp> }) export class ChildComponent { public responseData: any; ...

Distinguishing Between ReactDOM.render and React Component Render

As I delve into learning React, I have come across the render() method being used in two different ways: Firstly, it is used with ReactDOM.render() ReactDOM.render( < Test / > , document.getElementById('react-application') ); Sec ...

Delay the loading of HTML elements to improve website performance

While working on my portfolio, I noticed that the page load time is quite long due to all the images needing to load before the page is fully loaded. I started thinking if there is a way to delay or prevent the loading of images and then have them load la ...

Issue with AngularJS filter failing to properly filter data

This is the response I received in JSON format from a web service. [{"cid":"41","scname":"Baby Soap","scid":"1"},{"cid":"41","scname":"Baby Powder","scid":"2"},{"cid":"41","scname":"Baby Food","scid":"3"},{"cid":"41","scname":"Diapers","scid":"4"},... // ...