Implementing Promises in AngularJS Controller: A Comprehensive Guide

I'm currently working on implementing a basic function using promises in one of my controllers to make sure it works correctly before adding more complex functionality. I keep running into a "TypeError: undefined is not a function" error when trying to use the ".then(function(data){" in the lockPromise method.

Function called from view

    $scope.lockPromise = function(fieldId) {
        $scope.getLockMessage2(fieldId).getWeather()
            .then(function(data) {
                if (data === "returned SUCCESS info") {
                    alert("data is good");
                } else {
                    alert("FAILED");
                }
            }, function(error) {
                alert(error);
            });
    };

Second function in ctrl

    $scope.getLockMessage2 = function(fieldId) {
        return{
            getWeather: function() {
                return $http.get('/api/getData')
                    .then(function(response) {
                        if (typeof response.data === "string") {
                            return response.data;
                        } else {
                            return $q.reject(response.data);
                        }
                    }, function(response) {
                        return $q.reject(response.data);
                    });
            }
        };
    };

API GET

[Route("api/getData")]
public HttpResponseMessage GetData()
    {

        string data = JsonConvert.SerializeObject("returned SUCCESS info");

        return new HttpResponseMessage
        {
            Content = new StringContent(data, Encoding.UTF8, "application/json")
        };
    }

EDIT 1: code updated based on feedback

Answer №1

Update

$scope.getLockMessage2(fieldId).then

with

$scope.getLockMessage2(fieldId).getWeather().then

Answer №2

The function $scope.getLockMessage2 is expected to return an object, not a function.

Consider revising the code as follows (untested):

$scope.lockPromise = function(fieldId) {
    $scope.getLockMessage2(fieldId).getWeather()
        .then(function(data) {
            if (data === "good") {
                alert("Data is good");
            } else {
                alert("FAILED");
            }
        }, function(error) {
            alert(error);
        });
};

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 best way to deliver an HTML document in Express from a directory that is one level higher than my server folder?

I am facing an issue while trying to access an HTML file from my main directory through my Express server, which is located one level deeper in the server folder. Below is the configuration of my server code: const express = require('express') ...

Display a message indicating no data is available if the specified text is not found within the div

In the code snippet below, there is an input element followed by a div containing multiple child elements: <input type="text" onkeyup="filter()" id="filter_data"> <div id="body"> <div class="child"> Text 1 </div> <div class ...

Exploring Angular 4: Iterating Over Observables to Fetch Data into a Fresh Array

Context Currently, I am in the process of developing a find feature for a chat application. In this setup, each set of messages is identified by an index. The goal of the `find()` function is to retrieve each message collection reference from the `message ...

Why won't the code for detecting the DEL key in a textarea work on my computer?

I've been trying to detect when a user presses the Delete key and came across this helpful tutorial here The code worked flawlessly on jsfiddle.net, you can check it out here- http://jsfiddle.net. However, when I copied the same code to my local comp ...

Leveraging Discord.JS to seamlessly transport users in Discord to their designated voice channel by assigning roles

I'm attempting to transfer all users with a specific role from a voice channel using a command like: !summon @role This command should bring only the users with that specific role to the voice channel where the command was entered My current code is ...

Looking for a more efficient method to pass components with hooks? Look no further, as I have a solution ready for

I'm having trouble articulating this query without it becoming multiple issues, leading to closure. Here is my approach to passing components with hooks and rendering them based on user input. I've stored the components as objects in an array an ...

Ways to extract information from a text

I have a massive string, divided into two parts that follow this pattern: {\"Query\":\"blabla"\",\"Subject\":\"gagaga"}", {\"Query\":\"lalala"\",\"Subject\":\"rarara&bso ...

Issues with hover functionality in React Material Design Icons have been identified

I'm facing an issue with the mdi-react icons where the hovering behavior is inconsistent. It seems to work sometimes and other times it doesn't. import MagnifyPlusOutline from "mdi-react/MagnifyPlusOutlineIcon"; import MagnifyMinusOutli ...

Unable to activate button click event using jQuery

I am using dot.js to enhance a specific webpage by adding a button that, when clicked, should insert text into a text field and then trigger another button to be clicked as well. To achieve this functionality, I have implemented a click handler for my butt ...

Tips for iterating through a JSON object in JavaScript and building a table from it

My JSON data is structured like this: diferencias = { "1": { "1": 543.0, "0": 542.0 }, "2": { "0 1": 0.3333333333333333 } } I am trying to create a table with the outer keys as columns. This is the code I have written ...

Unlocking $refs with the Composition API in Vue3 - A step-by-step guide

I am currently exploring how to access $refs in Vue 3 using the Composition API. In my template, I have two child components and I specifically need to obtain a reference to one of them: <template> <comp-foo /> <comp-bar ref="ta ...

Correct the string based on a character error

When I have text to display in HTML, for example: var htmlStr = "1.first thing %10-15%. 2.second thing %25-44%. 3.third" And I want to display it in a div: $('#div1').html(htmlStr); However, when I display it in a DIV1 in HTML5 on a mobile pho ...

Problems during the installation of Webpack

Encountering Error Setting up Webpack and Babel with NPM npm ERR! Unexpected end of JSON input while parsing near '...pdragon":"^0.7.0","to' npm ERR! A complete log of this run can be found in: npm ERR! A complete log of this run can be found ...

Store data in Firebase Storage and retrieve the link to include it in Realtime Database

Utilizing Firebase Realtime Database and Firebase Storage for this application involves uploading images from the pictures array to Firebase Storage. The goal is to obtain the Firebase Storage link for each image, add it to the object pushed into imagesU ...

The proper method for organizing a nested array object - an obstacle arises when attempting to sort the array

I have a collection of data fetched from Web API 2.2 stored in an Angular array as objects. Each object represents a Client and includes properties like name, surname, and a collection of contracts assigned to that client. Here is the interface definition ...

Looking to verify characters, numbers, and special characters with jQuery's regular expression feature?

Currently, I am facing a challenge in validating the password field to allow characters, numbers, and special characters. It is essential that the password consists of exactly 8 characters. Despite searching online for a solution, I have been unsuccessful ...

The functionality of the jQuery .click method appears to be malfunctioning within the Bootstrap

It seems like my JQuery.click event is not functioning as expected when paired with the corresponding button. Any ideas on what might be causing this issue? Here's the HTML CODE snippet: <button id="jan7" type="button" class="btn btn-dark btn-sm"& ...

What is the best way to pass the values of two interlinked drop-down menus through an AJAX post request to a Django view?

Presently, I am encountering an issue with sending the values of two dropdowns to a django view. My code would have functioned correctly if the dropdowns were independent. Unfortunately, this is not the case as the first one updates the second one. Therefo ...

Tips for incorporating flow and TypeScript typings into an NPM module

Are there any resources available for adding both flow and typescript typings to an NPM module at the same time? I've been struggling to find a comprehensive guide on this topic, and it seems to be a common issue faced by open source library maintain ...

Identify the moment all Dropzones are added to a form

I am working on a page where multiple dropzones are set up for individual images. Once the user submits the form, all the images attached to the dropzones are resized and then added to the rest of the form fields. After resizing and appending the images, ...