Angular not detecting changes in string variables

Issue with variable string not updating

var angulargap = angular.module("angulargap", []);
angulargap.factory('cartService', function($rootScope,$http){    
    var fac ={
        message:"factory",
        getCart:function(call){
            $http.post("/rpc.php", {app:"get_cart",pag:"cart"})
            .success(function(data, status, headers, config) {
                fac.setMessage("success");      
            }).error(function(data, status, headers, config) {

            });

        },
        setMessage:function(m){fac.message=m;} 
    }
    return fac; 
});
angulargap.controller("iridium", function ($scope,cartService){     
    cartService.getCart();  
    $scope.message=cartService.message;
});

Instead of updating an array, everything works fine. What could be the issue here? Thanks

Answer №1

switch out this line

 setMessage:function(m){fac.message=m;} 

to be

 setMessage:function(m){message=m;} 

Answer №2

My problem was solved by replacing the string variable with an object

var angulargap = angular.module("angulargap", []);
angulargap.factory('cartService', function($rootScope,$http){    
    var fac ={
        messages:{cartnum:"0"},
        getCart:function(call){
            $http.post("/rpc.php", {app:"get_cart",pag:"cart"})
            .success(function(data, status, headers, config) {
                fac.setCounter("num from server");      
            }).error(function(data, status, headers, config) {

            });

        },
        setCounter:function(m){fac.messages.cartnum=m;} 
    }
    return fac; 
});
angulargap.controller("iridium", function ($scope,cartService){     
    cartService.getCart();  
    $scope.messages=cartService.messages;
});

Now everything is functioning correctly and I can see the results on the frontend. Can anyone clarify why using a string variable did not work?

This is how I'm currently displaying it:

{{messages.cartnum}}

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

What is the Proper Way to Add Inline Comments in JSX Code?

Currently, I am in the process of learning React and I have been experimenting with adding inline comments within JSX. However, when I try to use the regular JavaScript // comments, it leads to a syntax error. Let me share a snippet of my code below: const ...

retrieve a static method that returns an asynchronous value

Is there a way to have a static ES6 method in my code that simply returns a value instead of a promise? I'm looking for a solution to this problem: export default class Member { static existingMember() { var _existingMember; // DB.findExist ...

Reveal or conceal elements with a touch of animation

I am in the process of building my own website and I've been working on implementing a button that can toggle the visibility of a specific div element. While the functionality is there, I really want to incorporate an animation to enhance it. I attem ...

Having trouble choosing a subitem from a dropdown menu in Vuejs?

An example can be found at https://jsfiddle.net/79epsrmw/. However, the issue arises when targeting the item1 sub-menu in VS Code even after assigning a unique id. var app = new Vue({ el: '#app', data: { menuItems: [ ...

The localhost successfully accessed req.session.userid, but unfortunately the virtual host cannot be reached at this time

Having some trouble here... I've spent days trying to figure it out but nothing seems to be working. I am using Node.js Express session on the backend with users. When I log in, I set req.session.userId = "userid" and have a middleware that ...

I am encountering a problem while attempting to fetch information from Firestore through the Firebase JS SDK

My current challenge revolves around retrieving data from Firestore using the Firebase JS SDK. A specific error message persists: An unexpected issue arises: TypeError: firebase_firestore__WEBPACK_IMPORTED_MODULE_3__.getDoc(...).data is not a function I ...

Attempting to download an image through an axios fetch call

There is an issue I am facing while trying to retrieve an image from the website www.thispersondoesnotexit.com. function getImage() { axios({ method: 'get', url: 'https://www.thispersondoesnotexist.com/image' }) ...

What is the best way to create an animation where every letter in a word transitions to a different

Is there a way to animate a word so that each letter changes color within a range of 7 colors, with all letters displaying different colors simultaneously in an infinite loop? <div class="box"> <h1 class="logo animate__animated an ...

Determine using Lodash whether there is an object in an array that matches the ID from a separate array

There is a user array defined as follows: var users = [{ id: 1, name: 'ABC', isDisplay: true }, { id: 2, name: 'XYZ', isDisplay: true }, { id: 3, name: 'JKL', isDisplay: true }]; Additionally, there is another arra ...

Unable to locate the story details with the ID 167 and publisher ID 84 within the search state

Unable to find the solution for story.detail?storyId=167&pubId=84 in state search var params = 'storyId='+$scope.stories[index].ID+'&pubId='+$scope.pubId; $state.go('story.detail?'+params); $stateProvider .state( ...

When troubleshooting AJAX in Chrome, only the library lines are displayed in the call stack

While using "XHR breakpoints" to identify which line is triggering an AJAX request, I noticed that the call stack only shows Angular.js library lines. This makes it difficult to pinpoint the exact line in my code that triggered the request. What steps shou ...

A step-by-step guide on uploading a file to an AWS S3 bucket using a pre-signed URL in a Node

I am currently using S3 upload function in Node.js to upload files to an S3 bucket. The frontend of the application is built on Angular. However, my client now requires that all uploads be directed to the S3 bucket via a presigned URL. I am wondering if th ...

AngularJs, Dynamically Adjusting URL Parameters Based on User Input

I am currently working on integrating my ASP.NET Web API with AngularJs. I am facing an issue where I need to pass optional parameters to the URL based on user input from 2 HTML text boxes, but I am unsure of how to accomplish this. Below is a snippet of ...

Change the output of Object.fromEntries

I've been working on updating the values of an object using the .fromEntries() method. The issue I am facing is that even though I am returning a modified Array of hours, when the function completes it reverts back to the original complete Array. If ...

Having trouble getting smooth scrolling with easing to function properly

I'm facing an issue with a JQuery function that is supposed to enable smooth scrolling using JQuery easing, but for some reason, it's not functioning correctly and I'm unable to pinpoint the error. Here is the code for the function: $(func ...

Styling an active link in Next.js using Styled Components

Looking for a way to customize the active link style using styled components. I have a navigation bar where the currently active link should have a specific style applied. Any suggestions are appreciated! import React from 'react' import Link f ...

Modifying the color of an individual object in THREE.js: Step-by-step guide

I am currently working on editing a program that uses Three.js and Tween.js. Despite my efforts to find a solution both here and online, I have not been successful. The program involves creating multiple objects (cones) using THREE.Mesh, with a script that ...

AngularJS Default Option Selection

I am encountering some difficulties with the preselection of a select-input in angularJS. The select-box is being populated by an array. <select class="form-control" ng-model="userCtrl.selected_country" ng-options="country.name for country in userCt ...

Tips for effectively using the JQuery animate function

Displayed below is my implementation of the jQuery animate method abstraction that works well. However, a challenge arises when trying to replace the hard-coded DOM element class in the function ani(){} with the 'this' keyword for versatility acr ...

Ways to initiate a page redirection within the componentWillReceiveProps lifecycle method

When my webpage or component generates a form and sends it to the backend API upon submission, I receive an object in return if the process is successful. This object is then added to my redux store. In order to determine whether the reducer successfully ...