Nativescript-angular: No provider for RouterOutletMap! {NS} 2.1.0

Created on 30 Jun 2016  路  6Comments  路  Source: NativeScript/nativescript-angular

Hi,

I recently upgrade to v2.1.0 and started a new App.

I think there is a bug with the Angular router or maybe the NS_ROUTER_PROVIDERS.
Here is the error when i run

 tns run android 

on my Nexus 5x:

JS: EXCEPTION: Error in ./AppComponent class AppComponent - inline template:0:0
JS: ORIGINAL EXCEPTION: No provider for RouterOutletMap!

Here is my Code:

main.ts:

import {nativeScriptBootstrap} from "nativescript-angular/application";
import {AppComponent} from "./app.component";

nativeScriptBootstrap(AppComponent);

and my app.component.ts component :

import {Component} from "@angular/core";
import {RouteConfig} from '@angular/router-deprecated';
import {HTTP_PROVIDERS} from "@angular/http";
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from 'nativescript-angular/router';
import LoginPage from './components/login/login.component';

@Component({
    selector: "my-app",
    directives: [NS_ROUTER_DIRECTIVES],
    providers: [NS_ROUTER_PROVIDERS, HTTP_PROVIDERS],
    template: "<page-router-outlet></page-router-outlet>"
})
@RouteConfig([
     { path: '/Login', component: LoginPage, name: 'Login', useAsDefault: true}
])
export class AppComponent { }

the package.json dependencies :

"dependencies": {
    "@angular/common": "2.0.0-rc.3",
    "@angular/compiler": "2.0.0-rc.3",
    "@angular/core": "2.0.0-rc.3",
    "@angular/http": "2.0.0-rc.3",
    "@angular/platform-browser": "2.0.0-rc.3",
    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
    "@angular/platform-server": "2.0.0-rc.3",
    "@angular/router": "3.0.0-alpha.7",
    "@angular/router-deprecated": "2.0.0-rc.2",
    "nativescript-angular": "0.2.0",
    "tns-core-modules": "^2.1.0"
  },

I remember having the same problem with ng2 a few months ago and solve it by declaring the providers in the bootstrap function of the main.ts file like this:

bootstrap(AppComponent, [
     NS_ROUTER_DIRECTIVES, 
     NS_ROUTER_PROVIDERS
])

But still doesn't work...
Regards

Most helpful comment

Try import NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS from "nativescript-angular/router-deprecated/ns-router-deprecated"

import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router-deprecated/ns-router-deprecated";

All 6 comments

same here.

Try import NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS from "nativescript-angular/router-deprecated/ns-router-deprecated"

import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router-deprecated/ns-router-deprecated";

Works like 脿 charm ! Thank you

This was a breaking change we made in the 0.1.7.
If you are using the @angular/router-deprecated you should also use the nativescript-angular/router-deprecated.

import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router-deprecated/ns-router-deprecated";
-- works

this no longer works!

Was this page helpful?
0 / 5 - 0 ratings