angular - Angular2 Routing -
i following this tutorial of routing in angular, , doesn't work. when use 'comp' selector put it's html code, works, when i'm trying route router-outlet, shows header index.html
.
i have following:
main.ts:
import * ng 'angular2/angular2'; import {comp} './comp'; @ng.component({ selector: 'my-app' }) @ng.view({ directives: [ng.formdirectives, ng.routeroutlet], template: ` <nav> <ul> <li>start</li> <li>about</li> <li>contact</li> </ul> </nav> <main> <router-outlet></router-outlet> </main> ` }) @ng.routeconfig([{ path: '/', component: comp }]) class appcomponent { } ng.bootstrap(appcomponent, [ng.routerinjectables]);
comp.ts:
import * ng2 'angular2/angular2'; @ng2.component({ selector: 'comp' }) @ng2.view({ template: ` <h1>hi<h1> ` }) export class comp { constructor() { } }
index.html:
<!doctype html> <html> <head> <meta charset="utf-8" /> <title>test3</title> <script src="lib/traceur/traceur.js"></script> <script src="lib/system.js/dist/system.js"></script> <script src="lib/angular2-build/angular2.js"></script> <script src="lib/angular2-build/router.dev.js"></script> <script> system.config({ packages: { 'js': { defaultextension: 'js' } } }); system.import('/js/main'); </script> </head> <body> <h1>hello there</h1> <my-app></my-app> </body> </html>
breaking changes introduced in angular@2.0.0-alpha.41
routerinjectables
renamedrouter_bindings
router_bindings
renamedrouter_providers
aside: lots of breaking changes lately virtually none of online examples reliable.
use router_providers
it includes:
routeregistry
- registry of defined routeslocationstrategy = pathlocationstragety
- match routes path
this shortcut bootstrap router default setup.
for example:
@component ({ ... }) @view ({ ... }) @routeconfig ({ ... }) class app {} bootstrap(app, [ router_providers ]);
sources:
Comments
Post a Comment