Angular Injection Error: Received 1 argument instead of the expected 0

Although I have already looked for a solution to this problemhere, I am still struggling to resolve the error on my own.

I recently started an Ionic project and followed this link to implement authentication using Angular.

Everything seemed to be working fine until I used the following code:

@Injectable({
  providedIn: 'root'
})

This resulted in the error:

Typescript Error
Expected 0 arguments, but got 1.

I meticulously followed each step mentioned in the provided link, such as:

1: npm install npm@latest -g

2:

npm install -g @angular/cli, npm install @angular/cli

3: ng update @angular/cli

However, upon trying the 4th step ng update @angular/core, I encountered this

Package "@ionic-native/splash-screen" has an incompatible peer dependency to "rxjs" (requires "^5.5.11", would install "6.4.0").

Subsequently, when I executed ng update rxjs, I received this

Package "@angular/http" has an incompatible peer dependency to "rxjs" (requires "^5.5.0", would install "6.4.0").

Moreover, updating http using ng update @angular/http led to another error message:

Package "@ionic-native/core" has an incompatible peer dependency to "rxjs" (requires "^5.5.11", would install "6.4.0").

Consequently, I am at a standstill with upgrading @angular/core.

Additional note: As a newcomer to Ionic/Angular, I am unsure if the problem lies within the core version or elsewhere.

Note: I have attempted ng update, ng update --all, as well as clean uninstallation and reinstallation, to no avail.

Versions:

Ionic Framework: 3.9.3
Ionic App Scripts: 3.2.3
Angular Core: ^5.2.11
Angular Compiler CLI: 5.2.11
Node: 10.15.3
OS Platform: Windows 7
Navigator Platform: Win32
User Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML,like Gecko) Chrome/73.0.3683.86 Safari/537.36

Angular CLI: 7.3.8

Node: 10.15.3

OS: win32 x64

Angular: 5.2.11

... animations, common, compiler, core, forms, http

... platform-browser, platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.13.8

@angular-devkit/build-optimizer 0.0.35

@angular-devkit/core 7.3.8

@angular-devkit/schematics 7.3.8

@angular/cli 7.3.8

@angular/compiler-cli 7.2.12

@schematics/angular 7.3.8

@schematics/update 0.13.8

rxjs 5.5.11

typescript 2.6.2

webpack 3.12.0

Answer №1

It appears to be a deadlock scenario. To resolve this issue, kindly update the following versions of angular and rxjs manually by running:

npm i

After updating the above versions, proceed to update ionic using the following versions:

    "@angular/animations": "7.1.4",
    "@angular/common": "7.1.4",
    "@angular/compiler": "7.1.4",
    "@angular/core": "7.1.4",
    "@angular/forms": "7.1.4",
    "@angular/http": "7.1.4",
    "@angular/material": "7.2.1",
    "@angular/platform-browser": "7.1.4",
    "@angular/platform-browser-dynamic": "7.1.4",
    "@angular/router": "7.1.4",     
    "classlist.js": "1.1.20150312",
    "core-js": "2.6.1",
    "omni-slider": "1.2.1",
    "pikaday": "1.8.0",
    "rxjs": "6.3.3",
    "web-animations-js": "2.3.1",
    "zone.js": "0.8.26"

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

Leveraging the useRoute() function with Vue 3 Composition API and Typescript: [Vue alert]: The injection "Symbol(route location)" was not detected when employing Typescript

Just recently, I upgraded a Vue 2 application that heavily uses Vue Router and TypeScript to Vue 3. During the migration process, I switched a function from reading the route using this.$route in the Options API to using useRoute() in the Composition API. ...

How does the type of the original array influence the inferred types of the destructured array values?

let arr = [7, "hello", true]; let [a, ...bc] = arr; typeof bc : (string | number | boolean)[] why bc type is (string | number | boolean) expect: because bc = ["hello", true], so bc type should be (string | boolean)[] ...

Issue: EPERM error encountered, unable to perform rename/delete operation

Struggling with cordova and npm clis errors has become a daily occurrence for me as I work on different projects and platforms. An issue I encountered is that my Ionic1 application, which utilizes crosswalk-webview, functions properly on Android 6 but cra ...

Transforming HTML into a Console Experience (Angular 16)

I'm experimenting with creating a console/CLI style experience using HTML. The goal is to have the input fixed at the bottom of the window, while commands and output rise up from the bottom and eventually disappear off the top of the screen, enabling ...

Leverage the source code of Angular 2 in your project for seamless integration

Currently in the process of setting up Angular with npm: npm install @angular... Encountering an issue where the TypeScript source files are not included. I would like to have access to debug the code using the TypeScript source files (with source maps). ...

Unable to upload file in angular2 due to empty Body (FormData)

Attempting to upload a photo with Angular2 to my REST Service (Loopback). The Loopback service has been successfully tested using Postman and is able to accept files with the x-www-form-urlencoded header. Below is a simplified version of the service metho ...

Strategies for Dealing with 'No Search Results' in Your Search Functionality

I am currently facing an issue with displaying "No Results Found" when a user utilizes my search feature. The current problem is that "No Results Found" appears immediately on the screen and then disappears while a search query is being processed, only to ...

The content security policy is preventing a connection to the signalr hub

Currently, I am developing an application using electron that incorporates React and Typescript. One of the features I am integrating is a SignalR hub for chat functionality. However, when attempting to connect to my SignalR server, I encounter the followi ...

Error: Prisma seed - encountering issues with undefined properties (unable to read 'findFirst')

I've encountered a strange issue when using prisma seed in my nextjs full-stack project that I can't seem to figure out. Normally, when running the app with `next dev`, everything works smoothly and the queries are executed without any problems. ...

Utilizing Angular Forms for dynamic string validation with the *ngIf directive

I have a challenge where I need to hide forms in a list if they are empty. These forms contain string values. I attempted to use *ngIf but unfortunately, it did not work as expected and empty fields are still visible in the list. How can I address this iss ...

Using Lodash to eliminate objects from a list

I have a specific model for my list, it looks like this: Animal Model id name age gender city Within the animals[] = []; array that I am working with, I need to remove the fields name, age, and gender while keeping id and city. How c ...

Function in Typescript that accepts either a single object or an array of objects

We frequently use a simple function declaration where the function can accept either a single object or an array of objects of a certain type. The basic declaration looks like this: interface ISomeInterface { name: string; } class SomeClass { pu ...

There was an error encountered while creating a new CLI using oclif: Subsequent variable declarations must be of the same type

I've been working on developing a new CLI tool using the oclif framework and TypeScript, but I'm encountering some issues when attempting to build the project. When I generate the CLI, it results in errors. Even when I try to manually run npm bu ...

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 is the best way to broaden the capabilities of function objects through the use of

Below is a code snippet that raises the question of how one should define certain types. In this scenario, it is required that Bar extends Foo and the return type of FooBar should be 'a'. interface Foo { (...args: any):any b: string } i ...

Angular 2 Component attribute masking

In my Angular 2 component called Foobar, I have defined a property named foobar: import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-foobar', templateUrl: './foobar.component ...

Jasmine test case for Angular's for loop (Error: Expected the length of $ to be 11, but it should be 3

While creating test cases for a loop in Angular (Jasmine), I encountered an error: Error: Expected $.length = 11 to equal 3.. The loop is supposed to generate an array of arrays similar to const result. Can someone point out what I might have missed here? ...

Where's the tsconfig.json for Firebase Emulators?

I've encountered an issue with my Firebase project that's written in JavaScript (not TypeScript). When attempting to run the functions emulator, I'm getting the following error: $ firebase emulators:start --only functions ⚠ functions: Ca ...

How come the useEffect hook is causing re-rendering on every page instead of just the desired endpoint?

I am a novice attempting to retrieve data from a database and display it on the front-end using Axios, ReactJS, and TypeScript. My intention is for the data to be rendered specifically on localhost:3000/api/v1/getAll, but currently, it is rendering on all ...

Developing a Customized Filtering Mechanism in Angular 8

I have some experience working in web development, but I am relatively new to Angular. My current project involves creating a simple filter for a table's column based on user input. However, I'm facing an issue where typing in a single letter fil ...