How to maximize efficiency by utilizing a single function to handle multiple properties in Angular

I have 2 distinct variables:

$scope.totalPendingDisplayed = 15;
$scope.totalResolvedDisplayed = 15;

Each of these variables is connected to different elements using ng-repeat (used for limitTo)

When the "Load More" button is clicked (

ng-click="loadMore(totalResolvedDisplayed)"
), I want the loadMore function to be executed

$scope.loadMore = function(totalDisplayed) {
            totalDisplayed += 15;
        };

However, this function does not update the input field associated with either totalPendingDisplayed or totalResolvedDisplayed

I wish to avoid creating similar functions for each variable. How can I resolve this issue?

Answer №1

Transmit it as a text:

ng-click="addMoreData('totalResolvedDisplayed')"

In your application logic:

$scope.addMoreData = function(totalDisplayed) {
            $scope[totalDisplayed] += 15;
        };

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

Using Jquery to loop through a function for every select box that is added dynamically

Encountering some challenges with jQuery while attempting to utilize the same function and iterate over select boxes that are dynamically generated with jQuery's clone() method. Here is a snippet of the content being cloned: <select name="expense ...

Retrieving client information through the use of WebSockets

I am currently in the process of developing a collaborative sketchpad for multiple users, but I am facing challenges with maintaining an updated list of all connected users. My main goal is to effectively notify existing clients about new connections and p ...

Do we always need to incorporate components in Vue.js, even if there are no plans for reuse?

I've been pondering this question for some time now: is it necessary for every component to be reusable? Consider a scenario where we have HTML, CSS, and JavaScript that cannot be reused. For instance, a CRUD table designed specifically for managing u ...

Is there a way to retrieve the previous value in an input field's onChange event?

I am working with inputs in a React project and have assigned a function to their onChange event. While I have been able to access the current value, I am now looking for a way to retrieve the previous value as well. The reason I need the old value is bec ...

Issue with remove functionality in Vue js implementation causing erratic behavior in my script

Within my Vue.js code, I have a functionality that displays categories from an API. When a category is clicked, it is added to the AddCategory array and then posted to the API. I have also implemented a button called RemoveAll which successfully empties th ...

The event listener $(window).on('popstate') does not function properly in Internet Explorer

$window 'popstate' event is not functioning properly in IE when using the browser back button. Here is the code snippet used to remove certain modal classes when navigating back. $(window).on('popstate', function(event) { event.pre ...

Create a bespoke AngularJS directive for a customized Twitter Bootstrap modal

I am attempting to create a unique custom Twitter Bootstrap modal popup by utilizing AngularJS directives. However, I'm encountering an issue in determining how to control the popup from any controller. <!-- Uniquely modified Modal content --> ...

Issue with Node Webpack identifying the "Import" statement

I'm diving into the world of Node and Webpack, but I'm struggling with getting my project to compile properly. Every time I try to load it in the browser, I encounter the error message: Uncaught SyntaxError: Unexpected token import. Let me share ...

Retrieving the name and value of inputs from an Angular controller

Here are the inputs I have and I need to extract both their 'name' and 'value': <script> $scope.userAttributes = response.userAttributes.split(','); //$scope /* OR */ self.userAttributes = response.userAttributes.spl ...

Is there a way for me to send a URL request from my website to a different server using PHP?

I am looking to initiate a request from my website to my server using a specific IP address. From there, I need the server to send another request to a different server and then display the response on the webpage. Can anyone provide guidance on how to ...

Utilizing Redux dispatch to uncheck checkboxes within renderOption with Material UI Autocomplete

In the Autocomplete component, I have a checkbox that is rendered in the renderOptions prop. By using the onChange function event: object, value: T | T[], reason: string), I can retrieve the list of selected options. The value parameter will provide me w ...

"Placing drop-down animations in just the right spot

I'm currently working on adjusting the dropdown behavior for thumbnails when hovering over them. I want the drop-down to appear beneath the 'Caption Title' instead of above the image, but so far my CSS adjustments haven't been successfu ...

Angular2 Animation for basic hover effect, no need for any state change

Can anyone assist me with ng2 animate? I am looking to create a simple hover effect based on the code snippet below: @Component({ selector: 'category', template : require('./category.component.html'), styleUrls: ['./ca ...

Looking for assistance with transforming JSON data into a three-tiered multidimensional array using JavaScript

Seeking guidance on converting JSON data into a 3-tier multidimensional array using JavaScript. The JSON data I am working with is structured as follows: [ {'City':'Philadelphia','State':'Pennsylvania','Countr ...

What is the method for calculating the total number of keys in an object to assess an equation

I am attempting to conceal the parent element of a table (which has rows generated using ng-repeat) if the table does not contain any data. A solution I came across specifies this scenario for arrays, as shown in the example below: However, my situation i ...

Is it possible to incorporate dynamic variables into the directives of a nested loop? Plus, thoughts on how to properly declare variables in a node.js environment

Question Explanation (Zamka): <----------------------------------------------------------------------------------------------------------> Input Example: 100 500 12 1st Line: represents the left bound (L) 2nd Line: represents the right bound ...

Sinon respects my intern functions during testing in ExpressJS

At the moment, I am working on incorporating sinon stubs into my express routes. However, I am facing an issue where my functions are not being replaced as expected. I would like my test to send a request to my login route and have it call a fake function ...

"Complete with Style: Expand Your Horizons with Material-UI

The Autocomplete feature in Material UI is not expanding to the full width of the TextField element. Any suggestions on how to fix this issue? ...

Encourage users to activate the physical web feature in compatible web browsers

Is it possible to use JavaScript to encourage users to activate the physical web (and thus BlueTooth), similar to how APIs like "getUserMedia()" prompt users? UPDATE: Given that this technology is still in its early stages and not extensively supported, t ...

Retrieve the initial element from a JSON object to identify errors, without being dependent on its specific key name

Utilizing AngularJS, my JSON call can result in various errors. Currently, I am handling it like this: $scope.errors = object.data.form.ERRORS or $scope.errors = object.data.system.ERRORS However, in the future, 'form' or 'system' ...