Tips on dynamically passing parameters in Angular's $resource

Question

Tips on dynamically passing parameters in Angular's $resource

Is there a way to dynamically pass a default parameter value in $resource? Take a look at the Plunker for reference. In the code snippet below, I've set the default parameter in the factory as:

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {timeStamp : (new Date()).getTime()}, {
        query : {
            method : 'GET',
            isArray : true,
            cache : false
        }
    })
}]);

I'm looking to make the default param timeStamp dynamic. Currently, when I click on the Refresh Button, the param value remains the same (Check in console)

This functionality is needed because IE caches data for the GET method and I want to avoid cached data

javascript angularjs ngresource

Answer 1

Answer №1

Here is a helpful guide for you.

app.service('myService', ["$http", function($http) {
    return $http.get('http://example.com/data', {
        params: {
            timestamp : Date.now() // <-- new timestamp will be generated and assigned to timestamp
        }
    });
}]);

Every time you call the myService method, it will include a query parameter timestamp with the current timestamp value in the URL.

Answer 2

Here is a helpful guide for you.

app.service('myService', ["$http", function($http) {
    return $http.get('http://example.com/data', {
        params: {
            timestamp : Date.now() // <-- new timestamp will be generated and assigned to timestamp
        }
    });
}]);

Every time you call the myService method, it will include a query parameter timestamp with the current timestamp value in the URL.

Answer 3

Answer №2

var app = angular.module('plunker', ['ngResource']);

app.controller('MainCtrl', function($scope,myFactory) {
  $scope.refresh = function(){
    myFactory.query({timeStamp : (new Date()).getTime()}).$promise.then(function(){})
  }
});
app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {}, {
        query : {
            method : 'GET',
            isArray : true,
            cache : false
        }
    })
}]);

The execution of code within a function only occurs when the function is called. On the other hand, all code inside an object declaration is executed as the object is being created. Consider this alternative approach.

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {timestamp: 1433865286924}, {
        query : {
            method : 'GET',
            isArray : true,
            cache : false
        }
    })
}]);

Answer 4

var app = angular.module('plunker', ['ngResource']);

app.controller('MainCtrl', function($scope,myFactory) {
  $scope.refresh = function(){
    myFactory.query({timeStamp : (new Date()).getTime()}).$promise.then(function(){})
  }
});
app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {}, {
        query : {
            method : 'GET',
            isArray : true,
            cache : false
        }
    })
}]);

The execution of code within a function only occurs when the function is called. On the other hand, all code inside an object declaration is executed as the object is being created. Consider this alternative approach.

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {timestamp: 1433865286924}, {
        query : {
            method : 'GET',
            isArray : true,
            cache : false
        }
    })
}]);

Answer 5

Answer №3

According to Lekhnath, the accurate answer is:

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {}, {
        query : {
            method : 'GET',
            isArray : true,
            params : { ts : Date.now } // <-- new timestamp will be genrated and assigned to ts
        }
    })
}]);

Alternatively, if there is a need to provide default parameters:

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', { ts : Date.now }, { // <-- new timestamp will be genrated and assigned to ts
        query : {
            method : 'GET',
            isArray : true
        }
    })
}]);

Answer 6

According to Lekhnath, the accurate answer is:

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', {}, {
        query : {
            method : 'GET',
            isArray : true,
            params : { ts : Date.now } // <-- new timestamp will be genrated and assigned to ts
        }
    })
}]);

Alternatively, if there is a need to provide default parameters:

app.factory('myFactory', ["$resource", function($resource) {
    return $resource('http://google.com', { ts : Date.now }, { // <-- new timestamp will be genrated and assigned to ts
        query : {
            method : 'GET',
            isArray : true
        }
    })
}]);

Tips on dynamically passing parameters in Angular's $resource

Answer №1

Answer №2

Answer №3

Similar questions

Ways to update a single column in an HTML table when there is a change

The most effective method for adding data to a <pre /> element is through VueJS

React Native's state changes dynamically, however, the JSX conditional rendering fails to update the user interface accordingly

Is there a way to turn off the "swipe to navigate back" feature in Microsoft Edge using JavaScript or jQuery?

The functionality of Jquery autocomplete _renderItem appears to be malfunctioning

Tips for invoking a reduce mechanism within a separate function

Exploring D3 to extract nested information and build an interactive navigation tree

How can I display components using Angular CLI 5 without any visual output?

Issue with Magento site: Clicking on thumbnail photo does not update the large photo on mobile devices

Show users who liked a post from 2 different collections in Meteor

Difficulties encountered when trying to load liquid using Javascript

I encountered difficulty in assigning a JSON response to a variable, both with and without using JSON.parse()

While attempting to troubleshoot a program with mocha using the --debug-brk flag, it turns out that the debugging process actually

Do you think it's feasible to configure cookies for express-session to never expire?

Cookies are mysteriously invisible in the developer console of Safari/Chrome when using the Set-Cookie Header, yet they miraculously appear in server logs

How to access JavaScript files from "bower_components" instead of "node_modules" using webpack

Utilizing Google Analytics within an Angular Single Page Application

Connect the parent object's `this` to the child object's `this` in JavaScript

Eliminating the muted attribute does not result in the sound being restored

The actions performed within an event listener function are undone once they have been carried out