diff --git a/package.json b/package.json
index 83cf796d..7ac21675 100644
--- a/package.json
+++ b/package.json
@@ -6,15 +6,14 @@
"homepage": "http://akveo.github.io/ng2-admin/",
"license": "MIT",
"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.8",
- "@angular/router-deprecated": "2.0.0-rc.2",
+ "@angular/common": "2.0.0-rc.4",
+ "@angular/compiler": "2.0.0-rc.4",
+ "@angular/core": "2.0.0-rc.4",
+ "@angular/http": "2.0.0-rc.4",
+ "@angular/platform-browser": "2.0.0-rc.4",
+ "@angular/platform-browser-dynamic": "2.0.0-rc.4",
+ "@angular/platform-server": "2.0.0-rc.4",
+ "@angular/router": "3.0.0-beta.2",
"amcharts3": "github:amcharts/amcharts3",
"ammap3": "github:amcharts/ammap3",
"animate.css": "^3.5.1",
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 0f785054..9bfa7737 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,17 +1,10 @@
-import './app.loader.ts';
-
-import {Component, ViewEncapsulation} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
-import {Pages} from './pages';
-import {Login} from './pages/login';
-import {Register} from './pages/register';
-import {AppState} from './app.state';
-import {BaThemeConfigProvider, BaThemeConfig} from './theme';
-import {BaThemeRun} from './theme/directives';
-import {BaImageLoaderService, BaThemePreloader, BaThemeSpinner} from './theme/services';
-
-import {layoutPaths} from './theme/theme.constants';
+import "./app.loader.ts";
+import {Component, ViewEncapsulation} from "@angular/core";
+import {AppState} from "./app.state";
+import {BaThemeConfigProvider, BaThemeConfig} from "./theme";
+import {BaThemeRun} from "./theme/directives";
+import {BaImageLoaderService, BaThemePreloader, BaThemeSpinner} from "./theme/services";
+import {layoutPaths} from "./theme/theme.constants";
/*
* App Component
@@ -31,31 +24,6 @@ import {layoutPaths} from './theme/theme.constants';
`
})
-@RouteConfig([
- {
- path: '/pages/...',
- name: 'Pages',
- component: Pages,
- useAsDefault: true
- },
- {
- path: '/login',
- name: 'Login',
- component: Login
- },
- {
- path: '/register',
- name: 'Register',
- component: Register
- },
- // handle any non-registered route
- // and simply redirects back to dashboard page
- // you can specify any customer 404 page while it's not built in ito ng2-admin
- {
- path: '/**',
- redirectTo: ['Pages']
- }
-])
export class App {
isMenuCollapsed:boolean = false;
diff --git a/src/app/app.menu.ts b/src/app/app.menu.ts
index e182d889..1d75bc06 100644
--- a/src/app/app.menu.ts
+++ b/src/app/app.menu.ts
@@ -1,7 +1,7 @@
export const menuItems = [
{
title: 'Dashboard',
- component: 'Dashboard',
+ component: 'dashboard',
icon: 'fa fa-home',
selected: false,
expanded: false,
@@ -9,7 +9,7 @@ export const menuItems = [
},
{
title: 'Charts',
- component: 'Charts',
+ component: 'charts',
icon: 'fa fa-bar-chart',
selected: false,
expanded: false,
@@ -17,13 +17,13 @@ export const menuItems = [
subMenu: [
{
title: 'Chartist.Js',
- component: 'ChartistJs',
+ component: 'chartist-js',
},
]
},
{
title: 'UI Features',
- component: 'Ui',
+ component: 'ui',
icon: 'fa fa-laptop',
selected: false,
expanded: false,
@@ -31,25 +31,25 @@ export const menuItems = [
subMenu: [
{
title: 'Typography',
- component: 'Typography',
+ component: 'typography',
},
{
title: 'Buttons',
- component: 'Buttons',
+ component: 'buttons',
},
{
title: 'Icons',
- component: 'Icons',
+ component: 'icons',
},
{
title: 'Grid',
- component: 'Grid',
+ component: 'grid',
},
]
},
{
title: 'Form Elements',
- component: 'Forms',
+ component: 'forms',
icon: 'fa fa-pencil-square-o',
selected: false,
expanded: false,
@@ -57,17 +57,17 @@ export const menuItems = [
subMenu: [
{
title: 'Form Inputs',
- component: 'Inputs',
+ component: 'inputs',
},
{
title: 'Form Layouts',
- component: 'Layouts',
+ component: 'layouts',
},
]
},
{
title: 'Tables',
- component: 'Tables',
+ component: 'tables',
icon: 'fa fa-table',
selected: false,
expanded: false,
@@ -75,13 +75,13 @@ export const menuItems = [
subMenu: [
{
title: 'Basic Tables',
- component: 'BasicTables',
+ component: 'basictables',
}
]
},
{
title: 'Maps',
- component: 'Maps',
+ component: 'maps',
icon: 'fa fa-map-marker',
selected: false,
expanded: false,
@@ -89,19 +89,19 @@ export const menuItems = [
subMenu: [
{
title: 'Google Maps',
- component: 'GoogleMaps',
+ component: 'googlemaps',
},
{
title: 'Leaflet Maps',
- component: 'LeafletMaps',
+ component: 'leafletmaps',
},
{
title: 'Bubble Maps',
- component: 'BubbleMaps',
+ component: 'bubblemaps',
},
{
title: 'Line Maps',
- component: 'LineMaps',
+ component: 'linemaps',
}
]
},
diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
new file mode 100644
index 00000000..fdf86ea1
--- /dev/null
+++ b/src/app/app.routes.ts
@@ -0,0 +1,19 @@
+import { provideRouter, RouterConfig } from '@angular/router';
+import {LoginRoutes} from "./pages/login/login.routes";
+import {PagesRoutes} from "./pages/pages.routes";
+import {RegisterRoutes} from "./pages/register/register.routes";
+
+export const routes: RouterConfig = [
+ {
+ path: '',
+ redirectTo: '/pages/dashboard',
+ terminal: true
+ },
+ ...LoginRoutes,
+ ...RegisterRoutes,
+ ...PagesRoutes
+];
+
+export const APP_ROUTER_PROVIDERS = [
+ provideRouter(routes)
+];
diff --git a/src/app/pages/charts/charts.component.ts b/src/app/pages/charts/charts.component.ts
index 62cf1879..366a277c 100644
--- a/src/app/pages/charts/charts.component.ts
+++ b/src/app/pages/charts/charts.component.ts
@@ -1,8 +1,6 @@
-import {Component} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
+import {Component} from "@angular/core";
// import {ChartJs} from "./components/chartJs";
-import {ChartistJs} from "./components/chartistJs/chartistJs.component";
@Component({
selector: 'maps',
@@ -11,19 +9,6 @@ import {ChartistJs} from "./components/chartistJs/chartistJs.component";
styles: [],
template: ``
})
-@RouteConfig([
- {
- name: 'ChartistJs',
- component: ChartistJs,
- path: '/chartist-js',
- useAsDefault: true,
- },
- // {
- // name: 'ChartJs',
- // component: ChartJs,
- // path: '/chart-js',
- // },
-])
export class Charts {
constructor() {
diff --git a/src/app/pages/forms/forms.component.ts b/src/app/pages/forms/forms.component.ts
index 05bde0bf..253fca02 100644
--- a/src/app/pages/forms/forms.component.ts
+++ b/src/app/pages/forms/forms.component.ts
@@ -1,8 +1,4 @@
-import {Component} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
-import {Inputs} from './components/inputs';
-import {Layouts} from './components/layouts';
+import {Component} from "@angular/core";
@Component({
selector: 'forms',
@@ -11,19 +7,6 @@ import {Layouts} from './components/layouts';
styles: [],
template: ``
})
-@RouteConfig([
- {
- name: 'Inputs',
- component: Inputs,
- path: '/inputs',
- useAsDefault: true
- },
- {
- name: 'Layouts',
- component: Layouts,
- path: '/layouts',
- }
-])
export class Forms {
constructor() {
diff --git a/src/app/pages/login/login.routes.ts b/src/app/pages/login/login.routes.ts
new file mode 100644
index 00000000..cd428cc3
--- /dev/null
+++ b/src/app/pages/login/login.routes.ts
@@ -0,0 +1,14 @@
+import {RouterConfig} from "@angular/router";
+import {Login} from "./login.component";
+
+export const LoginRoutes: RouterConfig = [
+ {
+ path: '',
+ redirectTo: '/login',
+ terminal: true
+ },
+ {
+ path: 'login',
+ component: Login
+ }
+];
diff --git a/src/app/pages/maps/maps.component.ts b/src/app/pages/maps/maps.component.ts
index cc890fd8..bed642a2 100644
--- a/src/app/pages/maps/maps.component.ts
+++ b/src/app/pages/maps/maps.component.ts
@@ -1,10 +1,4 @@
-import {Component, ViewEncapsulation} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
-import {GoogleMaps} from './components/googleMaps';
-import {LeafletMaps} from "./components/leafletMaps";
-import {BubbleMaps} from "./components/bubbleMaps";
-import {LineMaps} from "./components/lineMaps";
+import {Component} from "@angular/core";
@Component({
selector: 'maps',
@@ -13,29 +7,6 @@ import {LineMaps} from "./components/lineMaps";
styles: [],
template: ``
})
-@RouteConfig([
- {
- name: 'GoogleMaps',
- component: GoogleMaps,
- path: '/google-maps',
- useAsDefault: true
- },
- {
- name: 'LeafletMaps',
- component: LeafletMaps,
- path: '/leaflet-maps',
- },
- {
- name: 'BubbleMaps',
- component: BubbleMaps,
- path: '/bubble-maps',
- },
- {
- name: 'LineMaps',
- component: LineMaps,
- path: '/line-maps',
- },
-])
export class Maps {
constructor() {
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index 67711628..3f2a77c4 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -1,15 +1,6 @@
import {Component, ViewEncapsulation} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
import {BaPageTop, BaContentTop, BaSidebar, BaBackTop} from '../theme/components';
-import {Dashboard} from './dashboard';
-import {Ui} from './ui';
-import {Maps} from './maps';
-import {Charts} from './charts';
-import {Forms} from './forms';
-import {Tables} from './tables';
-
@Component({
selector: 'pages',
encapsulation: ViewEncapsulation.None,
@@ -39,39 +30,6 @@ import {Tables} from './tables';
`
})
-@RouteConfig([
- {
- name: 'Dashboard',
- component: Dashboard,
- path: '/dashboard',
- useAsDefault: true,
- },
- {
- name: 'Ui',
- component: Ui,
- path: '/ui/...',
- },
- {
- name: 'Maps',
- component: Maps,
- path: '/maps/...',
- },
- {
- name: 'Charts',
- component: Charts,
- path: '/charts/...',
- },
- {
- name: 'Forms',
- component: Forms,
- path: '/forms/...',
- },
- {
- name: 'Tables',
- component: Tables,
- path: '/tables/...',
- }
-])
export class Pages {
constructor() {
diff --git a/src/app/pages/pages.routes.ts b/src/app/pages/pages.routes.ts
new file mode 100644
index 00000000..38d88d5a
--- /dev/null
+++ b/src/app/pages/pages.routes.ts
@@ -0,0 +1,114 @@
+import {RouterConfig} from '@angular/router';
+import {Dashboard} from "./dashboard/dashboard.component";
+import {Charts} from "./charts/charts.component";
+import {ChartistJs} from "./charts/components/chartistJs/chartistJs.component";
+import {Pages} from "./pages.component";
+import {Ui} from "./ui/ui.component";
+import {Typography} from "./ui/components/typography/typography.component";
+import {Buttons} from "./ui/components/buttons/buttons.component";
+import {Icons} from "./ui/components/incons/icons.component";
+import {Grid} from "./ui/components/grid/grid.component";
+import {Forms} from "./forms/forms.component";
+import {Inputs} from "./forms/components/inputs/inputs.component";
+import {Layouts} from "./forms/components/layouts/layouts.component";
+import {BasicTables} from "./tables/components/basicTables/basicTables.component";
+import {Tables} from "./tables/tables.component";
+import {Maps} from "./maps/maps.component";
+import {GoogleMaps} from "./maps/components/googleMaps/googleMaps.component";
+import {LeafletMaps} from "./maps/components/leafletMaps/leafletMaps.component";
+import {BubbleMaps} from "./maps/components/bubbleMaps/bubbleMaps.component";
+import {LineMaps} from "./maps/components/lineMaps/lineMaps.component";
+import {Login} from "./login/login.component";
+import {Register} from "./register/register.component";
+
+//noinspection TypeScriptValidateTypes
+export const PagesRoutes:RouterConfig = [
+ {
+ path: 'pages',
+ component: Pages,
+ children: [
+ {
+ path: 'dashboard',
+ component: Dashboard
+ },
+ {
+ path: 'charts',
+ component: Charts,
+ children: [
+ {
+ path: 'chartist-js',
+ component: ChartistJs
+ }
+ ]
+ },
+ {
+ path: 'ui',
+ component: Ui,
+ children: [
+ {
+ path: 'typography',
+ component: Typography
+ },
+ {
+ path: 'buttons',
+ component: Buttons
+ },
+ {
+ path: 'icons',
+ component: Icons
+ },
+ {
+ path: 'grid',
+ component: Grid
+ },
+ ]
+ },
+ {
+ path: 'forms',
+ component: Forms,
+ children: [
+ {
+ path: 'inputs',
+ component: Inputs
+ },
+ {
+ path: 'layouts',
+ component: Layouts
+ }
+ ]
+ },
+ {
+ path: 'tables',
+ component: Tables,
+ children: [
+ {
+ path: 'basictables',
+ component: BasicTables
+ }
+ ]
+ },
+ {
+ path: 'maps',
+ component: Maps,
+ children: [
+ {
+ path: 'googlemaps',
+ component: GoogleMaps
+ },
+ {
+ path: 'leafletmaps',
+ component: LeafletMaps
+ },
+ {
+ path: 'bubblemaps',
+ component: BubbleMaps
+ },
+ {
+ path: 'linemaps',
+ component: LineMaps
+ }
+ ]
+ },
+ ]
+ }
+];
diff --git a/src/app/pages/register/register.routes.ts b/src/app/pages/register/register.routes.ts
new file mode 100644
index 00000000..6b6a6513
--- /dev/null
+++ b/src/app/pages/register/register.routes.ts
@@ -0,0 +1,14 @@
+import {RouterConfig} from "@angular/router";
+import {Register} from "./register.component";
+
+export const RegisterRoutes: RouterConfig = [
+ {
+ path: '',
+ redirectTo: '/register',
+ terminal: true
+ },
+ {
+ path: 'register',
+ component: Register
+ }
+];
diff --git a/src/app/pages/tables/tables.component.ts b/src/app/pages/tables/tables.component.ts
index 13e1f44e..843722c0 100644
--- a/src/app/pages/tables/tables.component.ts
+++ b/src/app/pages/tables/tables.component.ts
@@ -1,7 +1,4 @@
-import {Component} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
-import {BasicTables} from './components/basicTables';
+import {Component} from "@angular/core";
@Component({
selector: 'forms',
@@ -10,14 +7,6 @@ import {BasicTables} from './components/basicTables';
styles: [],
template: ``
})
-@RouteConfig([
- {
- name: 'BasicTables',
- component: BasicTables,
- path: '/basic',
- useAsDefault: true
- }
-])
export class Tables {
constructor() {
diff --git a/src/app/pages/ui/ui.component.ts b/src/app/pages/ui/ui.component.ts
index a59df0ae..245b73d4 100644
--- a/src/app/pages/ui/ui.component.ts
+++ b/src/app/pages/ui/ui.component.ts
@@ -1,10 +1,4 @@
-import {Component} from '@angular/core';
-import {RouteConfig} from '@angular/router-deprecated';
-
-import {Typography} from './components/typography';
-import {Buttons} from './components/buttons';
-import {Icons} from './components/incons';
-import {Grid} from './components/grid';
+import {Component} from "@angular/core";
@Component({
selector: 'ui',
@@ -13,29 +7,6 @@ import {Grid} from './components/grid';
styles: [],
template: ``
})
-@RouteConfig([
- {
- name: 'Typography',
- component: Typography,
- path: '/typography',
- useAsDefault: true
- },
- {
- name: 'Buttons',
- component: Buttons,
- path: '/buttons',
- },
- {
- name: 'Icons',
- component: Icons,
- path: '/icons',
- },
- {
- name: 'Grid',
- component: Grid,
- path: '/grid',
- }
-])
export class Ui {
constructor() {
diff --git a/src/app/theme/components/baSidebar/baSidebar.component.ts b/src/app/theme/components/baSidebar/baSidebar.component.ts
index 929b4662..89eef900 100644
--- a/src/app/theme/components/baSidebar/baSidebar.component.ts
+++ b/src/app/theme/components/baSidebar/baSidebar.component.ts
@@ -1,5 +1,5 @@
import {Component, ElementRef, HostListener, ViewEncapsulation} from '@angular/core';
-import {Router} from '@angular/router-deprecated';
+import {Router} from '@angular/router';
import {AppState} from '../../../app.state';
import {layoutSizes} from '../../../theme';
@@ -35,7 +35,7 @@ export class BaSidebar {
private _state:AppState) {
this.menuItems = this._sidebarService.getMenuItems();
- this._onRouteChange = this._router.root.subscribe((path) => this._selectMenuItem());
+ // this._onRouteChange = this._router.root.subscribe((path) => this._selectMenuItem());
this._state.subscribe('menu.isCollapsed', (isCollapsed) => {
this.isMenuCollapsed = isCollapsed;
});
@@ -49,7 +49,7 @@ export class BaSidebar {
}
public ngOnDestroy():void {
- this._onRouteChange.unsubscribe();
+ // this._onRouteChange.unsubscribe();
}
public ngAfterViewInit():void {
diff --git a/src/platform/browser/directives.ts b/src/platform/browser/directives.ts
index 7693bb4b..732e4189 100644
--- a/src/platform/browser/directives.ts
+++ b/src/platform/browser/directives.ts
@@ -5,7 +5,7 @@
import {PLATFORM_DIRECTIVES} from '@angular/core';
// Angular 2 Router
-import {ROUTER_DIRECTIVES} from '@angular/router-deprecated';
+import {ROUTER_DIRECTIVES} from '@angular/router';
// application_directives: directives that are global through out the application
export const APPLICATION_DIRECTIVES = [
diff --git a/src/platform/browser/providers.ts b/src/platform/browser/providers.ts
index 9027794d..374533ce 100644
--- a/src/platform/browser/providers.ts
+++ b/src/platform/browser/providers.ts
@@ -7,8 +7,8 @@ import {FORM_PROVIDERS, LocationStrategy, HashLocationStrategy} from '@angular/c
// Angular 2 Http
import {HTTP_PROVIDERS} from '@angular/http';
-// Angular 2 Router
-import {ROUTER_PROVIDERS} from '@angular/router-deprecated';
+import {APP_ROUTER_PROVIDERS} from "../../app/app.routes";
+
/*
* Application Providers/Directives/Pipes
@@ -17,7 +17,7 @@ import {ROUTER_PROVIDERS} from '@angular/router-deprecated';
export const APPLICATION_PROVIDERS = [
...FORM_PROVIDERS,
...HTTP_PROVIDERS,
- ...ROUTER_PROVIDERS,
+ ...APP_ROUTER_PROVIDERS,
{provide: LocationStrategy, useClass: HashLocationStrategy }
];
diff --git a/src/vendor.ts b/src/vendor.ts
index a5c5b6cd..3ace4485 100644
--- a/src/vendor.ts
+++ b/src/vendor.ts
@@ -9,7 +9,7 @@ import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
-import '@angular/router-deprecated';
+import '@angular/router';
// RxJS
import 'rxjs/add/operator/map';