Retrieve information from a JSON file and send it as a parameter to a function within AngularJS

Currently, I am referring to this specific example. However, in my case, I am looking to retrieve data from a JSON file instead of utilizing local data. The scenario is:

    function store() {
       this.products = [
           new product("APL", "Apple", "Eat one every day to keep the doctor away!", 12, 90, 0, 2, 0, 1, 2),
           new product("AVC", "Avocado", "Guacamole anyone?", 16, 90, 0, 1, 1, 1, 2)
       ];
    }

    store.prototype.getProduct = function (sku) {
        for (var i = 0; i < this.products.length; i++) {
            if (this.products[i].sku == sku)
                return this.products[i];
        }

        return null;
    }

In my situation, there exists a straightforward file with the name "Product.json". My objective is to extract all necessary data directly from that file without making any other modifications.

Answer №1

If you already have your products.json file, you can utilize the angular $http service to fetch the information. Here is an example of how you can do it:

$http.get('products.json').success(function(data){
   $scope.products = data;
});

UPDATE: If you want to apply this to your specific scenario, make sure to assign the data received from the request to your store.products array.

$http.get('Products.json').success(function(data) {
    store.products = data;
});

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

Tips for displaying a const variable's data type within HTML syntax

Here is my code snippet: {% load static %} {% block extrascript %} <script src="{% static 'js/batch/batch_detail.js' %}"></script> <script src="{% static 'js/audit_log/audit_log.js' %}"></script> < ...

"Implement a function in PHP to include an array in every object within a larger

I am new to PHP and I am trying to figure out how to add an array within each object of an array. Essentially, it's an array inside an array where each object contains another array. I have searched online for solutions, but I couldn't find anyth ...

Incorporate a PHP GET parameter through an onclick event to redirect using window.location in JavaScript when a button is

I am trying to modify the onclick event of buttons that look like this: <button class="buttons" onclick="window.location='page_test.php?VAR=1&VAR2=2'">BUTTON 1</button> <button class="buttons" onclick="window.location='p ...

"Focus on loading only the parent element with Jquery .load() and ignore any

I'm attempting to use jQuery's .load() function to load a picture from another page. However, the element I'm trying to load has multiple children elements that also load on the current page. Is there a way to only grab the parent div and le ...

Adding up the values of an array of objects by month using ReactJS

To start off, I'm using ChartJS and need to create an array of months. Here's how it looks: const [generatedMonths, setGeneratedMonths] = useState<string[]>([]) const [totalValues, setTotalValues] = useState<number[]>([]) const month ...

Can JavaScript be used to update/override Prototype version 1.4 to version 1.7 on a different website?

(I'm uncertain about the best way to phrase this question, feel free to make changes). I am in the process of embedding a JS widget onto a different website that is using Prototype.js Version 1.4. I have incorporated jQuery into my widget and have it ...

Is it possible to activate ng-class following an ng-click event?

Here is the element in question: <a href="" ng-click="project.hasPhotos? removeFromProject(project, $index, currentPhoto) : addToProject($index, currentPhoto)" ng-class="{'selected-project': (belongsPhotoToProject(project, $index, currentPhot ...

The async task in Gulp version 4 seems to be hanging and not completing its

Currently, I'm in the process of transitioning my tasks to functions while working with v4 gulp. One of the tasks involves implementing a simple clean function that executes a parallel task. const clean_server = () => del('build/server/*&apos ...

Having trouble accessing the iframe element in an Angular controller through a directive

My webpage contains an iframe with a frequently changing ng-src attribute. I need to execute a function in my controller each time the iframe's src changes, but only after the iframe is fully loaded. Additionally, I require the iframe DOM element to b ...

What is the best way to perform this task in Angular2?

I am currently working with three arrays: tables = [{number:1},{number:2},{number:3},{number:4}]; foods = [ {id:1, name:'Ice Cream'}, {id:2, name:'Pizza'}, {id:1, name:'Hot Dog'}, {id:2, name:'Salad'} ]; o ...

What are the techniques for sorting and analyzing objects within an array?

I am working with a JSON structure that needs to be mapped, parsed, and filtered based on a specific attribute value. This process allows me to identify which object contains the desired value so I can access other attributes of the same object and impleme ...

The embed code is failing to load the HTML in the correct location

We're experiencing an issue with embedding a 3rd party form (HubSpot Form) on our website. Sometimes, the HTML of the form isn't located in the correct position - it should be placed directly after the script. <script>hbspt.forms.create({ ...

What are the steps to create a JSON output in this format?

Here is my intended final result {"rowcount":4 [{"provider_id":"1","provider_name":"Crecent Computers","sub_name":["Hardware","Software","Networks"]}],[{"provider_id":"4","provider_name":"Testing Co. LLC","sub_name":["Hardware","Software","Networks"]}],[{ ...

Struggling to integrate Karma and Jasmine into my Angular controller setup

After numerous attempts and hours of troubleshooting, I am still unable to successfully integrate Karma with my Angular controller. No matter what I try, the same error persists even when removing expectGET() calls - as soon as $http.flush(); is called. A ...

Guide on creating incremental movement for an object using three.js and tween.js

I am trying to create a scenario where my cylindrical objects (referred to as pions in the code) move step by step towards a specified object on a board of my design. Here is the code snippet I have: a: starting point index: target object attachEvent(_ ...

Display picture within a modal window, regardless of whether it is the identical image

I have a file input that allows the user to upload an image. After selecting an image, a modal opens with the uploaded image displayed inside. You can view a demo of this functionality in action on this Fiddle Example: Here is the corresponding code snip ...

Turn off the scrolling bars and only allow scrolling using the mouse wheel or touch scrolling

Is there a way to only enable scrolling through a webpage using the mouse wheel or touch scrolling on mobile devices, while disabling browser scroll bars? This would allow users to navigate up and down through div elements. Here is the concept: HTML: &l ...

VARIABLE_NAME isn't functioning properly on the window

The code window.VARIABLE_NAME is not functioning properly and is causing the following error. Can you please provide assistance? Uncaught SyntaxError: Unexpected token. This is the code I have written: var window.testing ...

How come the Jquery :odd selector picks out the even elements?

<html> <head> <script type="text/javascript" src="jquery-1.7.1.js" ></script> <script type="text/javascript"> $(function() { $("p:odd").html('modified'); }); </script> </head> & ...

Ways to extract data from a JSON array response

Trying to retrieve data for ahmedabad and surat using a location key. Here is the code snippet: $jsonResponse = Zend_JSON::decode(substr($response['body'], 9)); print_r($jsonResponse['result']); //output :Array ( [0] => Array ( [l ...