Cannot find the 'subscribe' property in the 'Promise<Response>' type

When trying to make an http request to an api and then console the result using .subscribe in Angular version 6.2 with Typescript version 2.9, I encountered the error "Property 'subscribe' does not exist on type 'Promise'". Despite making changes based on my research, the issue persists.

Below is a snippet of my AuthService file:


import { Injectable } from '@angular/core'
import { CONFIG } from '../config/config'
import { Http } from '@angular/http'
import 'rxjs/add/operator/toPromise'


@Injectable()

export class AuthService {

    constructor(private http: Http) {

    }

    register(name: String, email: String, password: String) {
        this.getConfig()
            .subscribe((response => {
                console.log(response)
            }))
    }

    getConfig() {
        return this.http.post(`${CONFIG.API_URL}/register`, { name: name, email: email, password: password }).toPromise()
    }
}

Answer №1

To fix this issue, simply delete the toPromise() method from your code

 updateConfig() {
        return this.http.post(`${CONFIG.API_URL}/update`, { name: newName, email: newEmail, password: newPassword })
    }

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 steps should I take to turn off ES Module Error notifications in VSCode?

After switching to the Bun JS Runtime, the distinction between ES Modules and CommonJS became irrelevant as Bun seamlessly handles both. However, VSCode seems to not be on the same page, throwing errors whenever actions that would work in Bun but not in No ...

Steps for appending a string to a variable

Currently working on creating a price configurator for a new lighting system within homes using Angular 7. Instead of using TypeScript and sass, I'm coding it in plain JavaScript. Page 1: The user will choose between a new building or an existing one ...

Obtain the complete path in Vue router by utilizing nested routes

After creating nested routes for Vue Router, I encountered a problem while using the routes to generate a navigation menu. Currently, I am using route.path in 'router-link :to=' which only gives me a part of the path. I want to include the absolu ...

Load page with sorted column in PrimeNg's <ptable> element

Utilizing primeNg's <p-table> component to showcase data in the following structure: HTML <p-table [value]="documents"> <ng-template pTemplate="header"> <tr> <th [pSortableColumn]="&apos ...

What is the process for adding an item to the dictionary state?

I'm currently working on a function to push an object to the state in my code. The goal of this function is to duplicate the first state object and append it to the end of the state array. addField() { const index = (this.state?.fields.length) -1 ...

Using JavaScript/TypeScript to sort through and separate two arrays

Creating a list of checkboxes on a UI allows users to toggle and filter data results. To achieve this, I am storing the selected checkboxes as a string array. The structure of my code is outlined below: export interface IMyObjectFromAPI { status: { ...

Dashboard for Decoupled Content Management System with Single Page Application

While conducting research for a new project, I came across the idea of building a SPA application (using Angular) with a headless CMS (which has not yet been chosen). Despite feeling confident in my expertise, there is one key aspect that I am uncertain ab ...

How can I retrieve JSON data that is specific to the selected item in an Ionic Angular application?

Exploring the world of ionic-angular framework, I have a home page with a modal embedded within it. The home page displays a list of items fetched from a JSON file, and upon clicking on a specific item, I wish to display all the information related to that ...

Issue encountered when importing a font in TypeScript due to an error in the link tag's crossorigin

How do I troubleshoot a TypeScript error when importing a custom font, such as a Google font? <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> Below is the specific error message: Type 'boolean' is ...

Adding an external component to an Angular 2 project

I've been facing challenges while trying to import an external component from a URL into a new Angular2 application. The issue I keep encountering is with the typescript failing to compile and run the application smoothly. Here is the specific import ...

Encountering a Difficulty while attempting to Distinguish in Angular

I am currently working on a form where I need to dynamically add controls using reactiveForms. One specific task involves populating a dropdown menu. To achieve this, I am utilizing formArray as the fields are dynamic. Data: { "ruleName": "", "ruleD ...

Transitioning from AngularJS to Angular: Updating the factory prototype

I've been in the process of migrating from AngularJS to Angular and have made a lot of progress. However, I am currently facing challenges with factories and prototypes. In this context, the Card object represents a playing card. function Car ...

Ideal method of re-entering ngZone following an EventEmitter event

There is a specific component that wraps around a library, and to prevent the chaos of change detection caused by event listeners in this library, the library is kept outside the Angular zone: @Component({ ... }) export class TestComponent { @Output() ...

What is the correct way to properly enter a Svelte component instance variable?

Currently, I am delving into learning Svelte and specifically exploring how to bind to a component instance as demonstrated in this tutorial: As I progress through the tutorial, I am attempting to convert it to Typescript. However, I have encountered an ...

When triggering the event: Was anticipating a spy, however received a Function instead

Upon running my test, I encountered the following error message: Error: Unhandled Promise rejection: <toHaveBeenCalledWith> : Expected a spy, but received Function. it('should change the value of myComponent', () => { spyOn(component ...

Exploring the functionality of Angular's Material Virtual Scroll and incorporating the scrollToIndex method

Is there a way to manage the scrollToIndex (virtual scroll) if my list is not loaded during the ngAfterViewInit lifecycle? I need to trigger the scroll to a specific index when redirecting from another page, which happens in the ts file. My objective is to ...

The best location to place a main.scss file within an Angular 2 project

I'm wondering where the best place is to put a main.scss file so that it can be utilized by all components. I attempted to place the css in app.component.ts (root component), but the styles weren't being applied to one of my components. Issue Re ...

Angular allows for the addition of unique styles to a JSON

When I receive a JSON response from BE, it is displayed as is. However, I would like certain keys such as "type, includeDeactive, code etc..." to be in bold and the corresponding values to be italicized after the colons (:). Example: body: { ...

Unlock the power of RouteReuseStrategy for select routes only by following these steps

Is it possible to apply the RouteReuseStrategy selectively to certain routes? What I mean is having a unique implementation of RouteReuseStrategy for each route with children, where the methods are only triggered when a route in a specific 'tree&apos ...

Having trouble getting this multi-select feature to function properly in Reactjs with Typescript? Let's figure out the solution together

I encountered an issue where I was unable to select multiple items due to a join error code "Property 'join' does not exist on type 'unknown'." in a .tsx file const DropdownMultiselect =()=> { return( <> ...