I just upgraded to Angular2 RC5. The app loads fine in all browsers exception IE10. I get an exception "No provider for PlatformRef!" when I bootstrap the application. Everything worked fine in RC4. I saw some posts on the web about this exception, but they were all related to Meteor. I do not use meteor. My project is derived from AngularSeed (previous version that I updated manually to RC5). Any idea on how to fix this? Thanks!
In IE10, I get this error:
No provider for PlatformRef!
{
[functions]: ,
context: <Permission denied>,
injectors: [ ],
keys: [ ],
message: "No provider for PlatformRef!",
name: "Error",
stack: undefined,
Symbol()_m.sovohbnexgu: undefined,
Symbol()_n.sovohbnexgu: undefined,
Symbol()_o.sovohbnexgu: undefined,
Symbol(rxSubscriber)_p.sovohbnexgu: undefined
}
main.ts:
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);
AppModule:
import { provide, NgModule, ExceptionHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './components/app/app.component';
import { AppExceptionHandler } from './app.exceptionhandler';
import { AppRoutes } from './app.routes';
import { LogService, ... } from './services/';
@NgModule({
declarations: [AppComponent, ...],
imports: [BrowserModule,
RouterModule.forRoot(AppRoutes),
HttpModule,
FormsModule],
providers: [provide(ExceptionHandler, { useClass: AppExceptionHandler }), LogService, ...],
bootstrap: [AppComponent],
})
export class AppModule { }
Dependencies versions:
- "@angular/common": "2.0.0-rc.5",
- "@angular/compiler": "2.0.0-rc.5",
- "@angular/core": "2.0.0-rc.5",
- "@angular/forms": "0.3.0",
- "@angular/http": "2.0.0-rc.5",
- "@angular/platform-browser": "2.0.0-rc.5",
- "@angular/platform-browser-dynamic": "2.0.0-rc.5",
- "@angular/router": "3.0.0-rc.1",
- "es6-module-loader": "^0.17.8",
- "core-js": "^2.4.0",
- "rxjs": "5.0.0-beta.6",
- "systemjs": "0.19.27",
- "zone.js": "0.6.13",
Edit: If I try to add PlatformRef to the @NgModule imports, I get this error:
shims.js?1472473326356:4 Uncaught TypeError: Cannot read property 'type' of null(anonymous function)
@ app.js?1472473326358:5getTransitiveModules
@ app.js?1472473326358:5CompileMetadataResolver._getTransitiveNgModuleMetadata
@ app.js?1472473326358:5CompileMetadataResolver.getNgModuleMetadata
@ app.js?1472473326358:5RuntimeCompiler._compileComponents
@ app.js?1472473326358:3RuntimeCompiler._compileModuleAndComponents
@ app.js?1472473326358:3RuntimeCompiler.compileModuleAsync
@ app.js?1472473326358:3PlatformRef_._bootstrapModuleWithZone
@ app.js?1472473326358:48PlatformRef_.bootstrapModule
@ app.js?1472473326358:48bootstrapper
@ app.js?1472473326358:57(anonymous function)
[...]
I get this stack on IE:
"TypeError: Unable to get property 'type' of undefined or null reference
at Anonymous function (eval code:13673:13)
at Call (http://localhost:5555/node_modules/es6-shim/es6-shim.js?1472473192889:289:7)
at forEach (http://localhost:5555/node_modules/es6-shim/es6-shim.js?1472473192889:1295:7)
at getTransitiveModules (eval code:13672:9)
at CompileMetadataResolver.prototype._getTransitiveNgModuleMetadata (eval code:13387:13)
at CompileMetadataResolver.prototype.getNgModuleMetadata (eval code:13259:17)
at RuntimeCompiler.prototype._compileComponents (eval code:15845:13)
at RuntimeCompiler.prototype._compileModuleAndComponents (eval code:15769:13)
at RuntimeCompiler.prototype.compileModuleAsync (eval code:15746:13)
at PlatformRef_.prototype._bootstrapModuleWithZone (eval code:9991:13)"
The solution was to remove es6-shim from the dependencies. Works fine now.
I think you should check the same after importing
PlatformRef
from@angular/core
and adding it toimports
configuration ofNgModule
for your AppModule file.