An issue has occurred where all parameters for the DataService in the D:/appangular/src/app/services/data.service.ts file cannot be resolved: (?, [object Object])

Upon running the command ng build --prod, an error is encountered.

Error in data.service.ts:

import { BadInput } from './../common/bad-input';
import { AppError } from './../common/app-error';
import { Injectable } from '@angular/core';
import { NotFoundError } from '../common/not-found-error';
import { throwError } from 'rxjs';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { catchError, map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class DataService {

  constructor(private url : string ,private http : HttpClient) { }

  getAll(){
    return this.http.get(this.url).
    pipe(map(response => response),
    catchError(
      this.handleError
    )         
    )}

  create(resource){
    return this.http.post(this.url,resource).
    pipe(
      catchError(
        this.handleError
      )
    )}

  update(resource){
    return this.http.put(this.url,resource).
    pipe(
      catchError(
        this.handleError
      )
    )}

  delete(resource){
    return this.http.delete(this.url+'/'+resource.id).
    pipe(
      catchError(
        this.handleError
      )
    )}

    private handleError(error : Response){
      if(error.status===404){
        return throwError(new NotFoundError(error));
      }
      if(error.status===400){
        return throwError(new BadInput(error))
      }
      return throwError(new AppError(error))
    }}

Answer №1

Do you find this helpful?

import { BadInput } from './../common/custom-bad-input';
import { AppError } from './../common/app-error-handler';
import { Injectable } from '@angular/core';
import { NotFoundError } from '../common/error-not-found';
import { throwError } from 'rxjs';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { catchError, map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class DataService {

  constructor(private http : HttpClient) { }

  getAll(url : string){
    return this.http.get(url).
    pipe(map(response => response),
    catchError(
      this.handleError
    )         
    )} 

  create(url : string, resource){
    return this.http.post(url,resource).
    pipe(
      catchError(
        this.handleError
      )
    )}

  update(url : string, resource){
    return this.http.put(url,resource).
    pipe(
      catchError(
        this.handleError
      )
    )}

  delete(url : string, resource){
    return this.http.delete(url+'/'+resource.id).
    pipe(
      catchError(
        this.handleError
      )
    )}

    private handleError(error : Response){
      if(error.status===404){
        return throwError(new NotFoundError(error));
      }
      if(error.status===400){
        return throwError(new BadInput(error))
      }
      return throwError(new AppError(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

Experiencing difficulties with PrimeNg installation on Angular 12.1.4 due to an npm error

I'm facing an issue while trying to integrate PrimeNG into my project. I encountered a strange error and I'm unsure about how to resolve it. Can anyone offer some assistance? The Angular version currently installed on my machine is 12.1.4. 205-18 ...

Escaping double quotes in dynamic string content in Javascript can prevent unexpected identifier errors

Need help with binding the login user's name from a portal to a JavaScript variable. The user's name sometimes contains either single or double quotes. I am facing an issue where my JavaScript code is unable to read strings with double quotes. ...

What's the trick to aligning the label on the material-ui text field to the right side?

I am working on a React project with an RTL layout using material-ui and typescript. I am struggling to align the label of a text field to the right. Can anyone help me with this? ...

The parameter 'NextApiRequest' cannot be assigned to the parameter 'Request'

I encountered a typescript issue that states: Argument of type 'NextApiRequest' is not assignable to parameter of type 'Request'. Type 'NextApiRequest' is not assignable to type '{ url: string; }'. Types of pro ...

Steps for showing personalized validation error messages in Angular 7

Is there a way to highlight the input field of a form with a red border and display the message Password is invalid when a user types in a password that does not match the set password? I have managed to see the red border indicating an error when I enter ...

In order to toggle the input field's state depending on the select component's value in Angular

I have a situation with two components: a select component and an input component, as shown in the image below: Scenario: Currently, the input field is disabled by default. If an option is selected from the select component, then the input field becomes a ...

angular index.html code displayed

I successfully deployed an Angular app on a server in the past without any issues. The Angular version is 6.1.1, Angular CLI version is 6.2.9, npm version is 6.13.4, and node version is 10.18.0 for both local and server environments. The server is running ...

What is preventing me from adjusting the padding of the mat-button?

Trying to adjust the default padding of a mat-button, but encountering issues with changing the component's style. Any suggestions on how to subscribe to the default padding (16px)? I've attempted modifying CSS properties to set the padding of a ...

Performing a HTTP GET request in Angular 2 with custom headers

I recently came across some posts discussing how to set headers in a GET request. The code snippet below demonstrates one way to do this: let headers = new Headers({ 'Accept': 'application/json' }); headers.append('Authorization&a ...

Leveraging the @Input Decorator in Angular 2

Check out the Angular 2 component code sample below @Component({ selector: 'author-edit', templateUrl:'./author/edit' }) export class AuthorEditComponent implements OnInit{ @Input() author: AuthorModel; fg: FormGroup; c ...

Guide to incorporating external code in InversifyJS without direct control

I'm wondering if it's feasible to add classes that are not editable. Inversify seems to rely heavily on annotations and decorators, but I'm curious if there is an alternative method. ...

Utilize the standard error handler in Angular 4

In my Angular4 application, I have set up a custom error handler as follows: @Injectable() export class CustomErrorHandler implements ErrorHandler { handleError(error) { switch (error.type) { case 'custom': doTheThing(); defa ...

Ways to verify the identity of a user using an external authentication service

One of my microservices deals with user login and registration. Upon making a request to localhost:8080 with the body { "username": "test", "password":"test"}, I receive an authentication token like this: { "tok ...

What is the best way to connect my Typescript NextJS code to my Express API?

My goal is to extract data from my API, which is providing the following JSON: [ { project: "Challenges_jschallenger.com" }, { project: "Using-Studio-Ghilis-API-With-JS-Only" }, { project: "my-portfolio-next" }, { proj ...

accessing observables programmatically in Angular 5 using a service getter

Assistance Needed with Service Component ... cart: any = {...}; //observable set in a subscription to an API response get Cart() { return this.cart; } ... Problem with Component Implementation get Cart() { return this.bcCartService.Cart; } constru ...

What steps should I follow to activate Ivy in Angular 8 or 9?

Can you guide me through the process of enabling Ivy on an Angular 8 or 9 project? Ivy is the exciting new rendering engine designed for Angular that brings a wealth of useful features while still maintaining compatibility with existing Angular projects. ...

Develop an enhancement for the Date object in Angular 2 using Typescript

Using the built-in Date type, I can easily call date.getDate(), date.getMonth()...etc. However, I am looking for a way to create a custom function like date.myCustomFunctionToGetMonthInString(date) that would return the month in a string format such as &a ...

What is the best way to link this to a function in AngularIO's Observable::subscribe method?

Many examples use the Observable.subscribe() function in AngularIO. However, I have only seen anonymous functions being used like this: bar().subscribe(data => this.data = data, ...); When I try to use a function from the same class like this: update ...

When creating an async function, the type of return value must be the universal Promise<T> type

https://i.stack.imgur.com/MhNuX.png Can you explain why TSlint continues to show the error message "The return type of an async function or method must be the global Promise type"? I'm confused about what the issue might be. UPDATE: https://i.stac ...

What steps should I take to resolve issues with importing Angular modules?

Success! import { MatInputModule } from '@angular/material/input' import { MatSelectModule } from '@angular/material/select' Having Issues import { MatInputModule, MatSelectModule } from '@angular/material' What could be c ...