The variable 'subscribe' is not recognized in the data type 'Subscription'

Using the GET method here to retrieve the list of applied jobs. This code snippet is taken from the appliedJobsPage.

this.getjobs.getAppliedjobList().subscribe(data => {
      this.appliedjobs = data;
    })

This code is part of my provider page getJobs.

getAppliedjobList() {
    let headers = new Headers();
    headers.append('Content-Type','application/json');
    return this.http.get('http://localhost:3000/api/appliedjobs',{headers: headers})
    .map(res => res.json())
    .subscribe(data => {
      this.jobslist = data;
    });
  } 

An error message is popping up stating:

Property 'subscribe' does not exist on type 'Subscription'. Did you mean 'unsubscribe'?

Answer №1

The reason for this error is because you are already subscribed to the observable.

map(res => res.json())
    .subscribe(data => {
      this.jobslist = data;
    });

If you are using angular version 5 or newer, you can skip the map(res => res.json()) part. However, you must make sure to unsubscribe from the observable in your service in order to subscribe to it in your component. Remove the following code from your service:

.subscribe(data => {
          this.jobslist = data;
        });

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

Facing an error in the terminal while developing a controller for my sign-in route

As a beginner creating an e-commerce website on MERN stack, I encountered an error while coding the controller for the signin route. Here is the error message: C:\Users\AbTorres9\Desktop\MERN\projbackend>node start internal/mod ...

Utilize ASP.NET Boilerplate Core and Angular on Microsoft Azure for seamless deployment

I am looking to deploy ASP.NET Boilerplate Core & Angular on Microsoft Azure. The current version of ASP.NET Boilerplate consists of two solutions (one for the backend and one for the frontend), so I need to deploy them on two separate AppServices along wi ...

Fetch data from a JSON file using a URL

Having trouble accessing data from a JSON file via URL. Everything seems to be in order but nothing is working, and I'm at a loss for how to troubleshoot it. service export class JsonService { public getMenuData(): Observable<any> { ...

What is the process for setting up a signup and sign-in page in Angular 12 while incorporating local storage for authentication?

After saving signup data using local storage, I am now looking to utilize that information on the login page for user authentication. What specific code should be implemented on the login page in order to verify whether the individual has signed up or no ...

What strategies can be utilized to manage a sizable data set?

I'm currently tasked with downloading a large dataset from my company's database and analyzing it in Excel. To streamline this process, I am looking to automate it using ExcelOnline. I found a helpful guide at this link provided by Microsoft Powe ...

Maintain query parameters in Angular6 while routing with canActivate

When using Auth guard to verify login status and redirecting to the login page if a user is not logged in, there seems to be an issue with losing all query parameters during the redirection process. I attempted to preserve the query params by adding { qu ...

NextJS: Route Handler encountering Method Not Allowed (405) error when trying to redirect

Current NextJs version is 13.4.3 I have set up a route handler to capture POST requests. For more information on route handlers, please refer to the documentation at [https://nextjs.org/docs/app/building-your-application/routing/router-handlers] In this ...

Using React TypeScript, describe the type of ref and mouse event

I am facing an issue with my navbar that I want to hide when clicking outside the sidenav. I came across a useful code snippet that can help me achieve this, but I need to ensure I use the correct types while implementing it in TypeScript. This particular ...

What is the most effective method for declaring callbacks on objects in Typescript?

I am currently working on a sidebar menu component that is connected to a service holding items in the menu. This allows multiple sources to make alterations to the menu as needed. Each item in the menu currently follows the SidebarItem interface: export ...

Revise regular expression for verifying addresses

In my angular app, I have created a regular expression for validating postal addresses. const regx = '\\b([p]*(ost)*\\.*\\s*[o|0]*(ffice)*\\.*\\s*b[o|0]x)\\b' I specifically want this ...

Automatically display changes made in MySQL/MariaDB within a React table

In my node.js/express/react/socket.io application, I need to capture data when a button is clicked and insert it into a MySQL/MariaDB table. My query is, Is there a React component that can automatically update itself (showing the table rows from the DB i ...

What is the best way to inform the user of their login status in Angular?

As a newcomer to angularfire2, I am currently working on implementing authentication and providing the user with feedback on their login status. I am using version angularfire2": "^5.0.0-rc.4. I came across an example on this site, but I am unsure of how i ...

Designations for removing an item at a targeted subdirectory location

type Taillet<T extends any[]> = ((...t: T) => void) extends (( h: any, ...r: infer R ) => void) ? R : never; type NestedOmit<T, Path extends string[]> = T extends object ? { 0: Omit<T, Path[0]>; 1: { [ ...

Developing J2EE servlets with Angular for HTTP POST requests

I've exhausted my search on Google and tried numerous PHP workarounds to no avail. My issue lies in attempting to send POST parameters to a j2ee servlet, as the parameters are not being received at the servlet. Strangely though, I can successfully rec ...

Obtain information from a web address using Ionic framework

Hello, I am experiencing an issue with retrieving data from a URL in my Ionic application. When using @angular/http to fetch a JSON object from the URL, everything works fine in the browser when running 'ionic serve'. However, when deploying the ...

There are no HTTP methods being exported in this specific file. Remember to export a named export for each individual HTTP method

Currently, I am working on a React.js/Next.js project that incorporates Google reCAPTCHA. The frontend appears to be functioning properly as I have implemented print statements throughout the code. However, I am encountering an error in the backend display ...

Exploring ways to incorporate the context value into my component's functionality

Hi, I'm new to TypeScript and I'm facing an issue when trying to use a value I created in my context API. I keep getting the error message "Property 'sidebar' does not exist on type 'IStateContext | null'", even though it exis ...

What is the best way to determine the type of a key within an array of objects

Suppose I have the following code snippet: type PageInfo = { title: string key: string } const PAGES: PageInfo[] = [ { key: 'trip_itinerary', title: "Trip Itinerary", }, { key: 'trip_det ...

Is it possible to use a combination of pipe, tap, and subscribe in Angular

I am attempting to fetch data using HttpClient in Angular. Here's how my code appears: getData(suffurl: string, id?:number): Observable<any[]> { return this.http.get<any[]>('localhost:5555/DNZ/'+ this.suff_url) .pipe( ...

Error 401: Access Denied for @angular/cli@latest - Version Angular 7.0.4

Today when I started working on my project, I encountered an error that said: ERROR TypeError: Cannot read property 'whitelist' of undefined at isFiltered (:1:5016) at Object.x [as send] (:1:74196) at DevtoolsExtension.push../node_modules/@ngrx/s ...