-
Notifications
You must be signed in to change notification settings - Fork 24.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Angular 5.0.0 error: StaticInjectorError[InjectionToken DocumentToken] #20101
Comments
I think this error occurs because you need to import HttpModule(deprecated) as well as HttpClientModule, because some dependency still relies on HttpModule. |
Does not seem to make any difference (moreover, if some of the dependencies use the deprecated Http, I guess they import it in their module already). But thanks, though. |
I have the same issue in watch mode. |
@filipbarak I tried reproducing the issue but was unable to: https://stackblitz.com/edit/angular-gitter-caoddx?file=app%2Fapp.component.ts Would someone be able to produce a minimal reproduction that we can investigate the issue with? The issue is likely due to a 3rd party lib , so that's where i'd suggest to start looking, even just searching for use of |
@Toxicable I think I found it, @angular/material version is 2.0.0-beta.8, I guess it is time to upgrade :) Thank you for your help. |
I am getting the same error, checked all my dependencies and none are dependent on HttpModule. Wierd thing is it works if it run it with Cli 1.2.9 with Angular 5 but not with Cli 1.5 and Angular 5. |
@sandangel was a rather surprised but it worked, did of course upgrade some packages but it was fairly straight forward. |
I fixed my problem. |
@trotyl : i removed my flag --aot and i replace it by --preserve-symlinks and it works fine. Thank you |
5.1 will gives more context for injection errors. |
import {HttpClientModule, HttpClient} from '@angular/common/http'; then: will be ok |
If you have found a bug then opening a new issue for that bug would be the best action here. |
Had the same issue when creating a custom directive using and importing Window without declaring it in providers and trying to access it inside a component |
Add this in app.module.ts import { HttpClientModule } from '@angular/common/http' and also add HttpClientModule in your imports |
Everything might be much simpler - for me, the solution was to fix my code. "ngIf" without leading asterisk will cause this exception to be thrown. |
Yes adding these below to app.module.ts worked. Thanks @usmanakram1996 import { HttpModule } from '@angular/http'; and importing worked imports: [ |
@pragadeesh2050 , can you please share your system.config.js. |
I am getting the same error, including Httpmodule did not work for me. my app.module.ts: -
exportTopdf.component.ts file: -
my service code: -
system.config.js: -
package.json: -
Error i am getting is: -
|
@Sagar1990 have you imported this import { HttpClientModule } from '@angular/common/http' in app.module.ts? |
No need to import HttpModule Just make sure, you have provided your service in providers after importing it in app.module.ts import { ApiService } from './app.service' |
I got this error after importing a component library I built with ng-packagr. I had to change the |
Thanks @maniwadhwa26 it works for me... |
Thanks @maniwadhwa26 it works for me too. :-) |
Thanks, @maniwadhwa26 Works for me tooo 👍 |
Hi, I don't know how to add --preserve-symlinks |
Helllo.. there... |
I have the same problem with Angular 5.2.7
In my component, this generates an error :
I have try all solution exposed in above but no works... |
@Wordeur ... it certainly works ... so you have to have a problem in your code which you simply don't see ... so prepare a simple Stackblitz reproduction demo ... and you will see that it works. |
Hey, I'm struggling with similar issue as this stackOverFlow question - Angular can't use HttpClient in external library. In short - i'm trying to compile my app as a ng-module (using ngc), so it could be imported by another outer app. Unfortunately, though my app works fine by itself; it can't be imported by the outer app, due to the error mentioned above. None of the solutions suggested above solved the problem. Help would be appreciated. |
I solve this by following two steps:
|
Stuck here The xxxx Please reply or comment Only If You Know where this makes shit........... |
All you need to do is to import your service in your app.module, like, import { HeroService } from '../app/hero.service'; and then, provide it to your providers array in the same file, like, providers: [HeroService] I hope this will help.... |
@madhavsharmaagra Thanks for the help, but if you see the sample-app, there is no service in my sample-app. So it is not applicable. |
removing the following from my provider helped, import { HttpClient } from '@angular/common/http'; |
@filipbarak @Toxicable @ebrehault @ochezeau @sekurukaguvi |
I already had these import statements inside my app.module.But still the StaticInjectorError ...NullInjectorError poped up. import { BrowserModule } from '@angular/platform-browser'; THIS IS HOW I GOT IT RESOLVED
and then add your service for eg., xyzNotificationService__ to the providers: [ ] section of your app.module |
@nayfin how did you manage to package it with ng-packagr if you have empty dependencies? |
@ledicjp are you talking about when you build or when you package. At the moment I change the parameter name to I started this library before ng 6 implemented its own library helper utility and I still have a lot to learn in this area. I plan on rebuilding soon and digging into this more. I'll update post then. Hope this at least gets you unblocked. |
@shaharido1 : I have also the same issue, Angular can't use the HttpClient in the external module. That's why the import : import { HttpClient } from '@angular/common/http'; in the core project doesn't help. |
@ledicjp I am coming to realize that I am just going to have to rebuild using the cli. Here is a walk-through for anyone else who's coming to the same realization. Hopefully not too painful. Update: Using the cli to generate library has been a really been a nice experience. It structures the library nicely, makes it easy to setup a sandbox app for testing, and bypasses a lot of the difficulties of setting up library manually. Still have a lot of components to move over but I think this was the right move to make. |
@nayfin Can I use this also for the previous versions? My project is based on Angular 5. I cannot upgrade it right now. |
I was like, HAY HOERAY let's start a new project (templated from Visual Studio 2017 v15.7.3) didn't even run out of the box but I want to upgrade angular anyway to 6, did that, solved every dependency issue that was raised until no warnings were left. Boom, got this, no issue seems to resolve my issue. Ended up copy-pasting an other web project with angular 5.0.1 which works. Angular Team, I call this unstable release management. |
this error could be indication that you didn't register your service as a providers in the app.module.ts |
Is this a troll post XD Go SO wtf |
Where to import this? in the main module or the component one? |
@ugurkoysuren i believe the ng g library functionality was added in v6. |
In my case, a
|
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
I'm submitting a...
Current behavior
I have upgraded my current project from 4.4.4 to 5.0.0 using the recommandations from https://angular-update-guide.firebaseapp.com/
And now when I launch
ng serve
, the page keeps blank and the browser console returns the following error:The traceback indicates it comes from the bootstraping in my
main.ts
:but unfortunately, nothing more specific.
Expected behavior
No error.
Minimal reproduction of the problem with instructions
I do not know how to reproduce this bug, my existing codebase is quite large.
I am aware it might be difficult to answer my issue, but I just ask to know if this error message rings a bell to anyone, so I know where to start digging.
What is the motivation / use case for changing the behavior?
Environment
Browser:
For Tooling issues:
Others:
The text was updated successfully, but these errors were encountered: