angular - Error trying to reach github route -
i'm trying change beta router new component router,
project started official angular2 seed: https://github.com/angular/angular2-seed
so how seed-app.ts looks like:
import {component} '@angular/core'; import {router, routes, router_directives} '@angular/router'; import {home} './components/home/home'; import {about} './components/about/about'; import {repobrowser} './components/repo-browser/repo-browser'; @component({ selector: 'seed-app', providers: [], pipes: [], directives: [router_directives], styles: [require('./seed-app.scss')], template: require('./seed-app.html'), }) @routes([ { path: '/home', component: home}, { path: '/about', component: about}, { path: '/github/...', component: repobrowser}, ]) export class seedapp { constructor() {} }
and template seed-app:
<div class="seed-app"> <h3> angular 2 seed </h3> <nav> <a [routerlink]=" ['/home'] "> home </a> | <a [routerlink]=" ['/about'] "> </a> | <a [routerlink]=" ['/github/repo-list', {org: 'angular'}] "> github repos </a> </nav> <main> <router-outlet></router-outlet> </main> <footer> © 2016 </footer> </div>
all routes working except can't reach github route @ all, getting error:
exception: error: uncaught (in promise): cannot match routes. current segment: 'github'. available routes: ['/home', '/about', '/github/...'].
if helps code repo-browser.ts
import {component} '@angular/core'; import {router, routes, router_directives} '@angular/router'; import {repolist} '../repo-list/repo-list'; import {repodetail} '../repo-detail/repo-detail'; import {github} '../../services/github'; @component({ selector: 'repo-browser', template: require('./repo-browser.html'), styles: [require('./repo-browser.scss')], providers: [ github ], directives: [ router_directives ], pipes: [] }) @routes([ {path: '/:org', component: repolist}, {path: '/:org/:name', component: repodetail }, ]) export class repobrowser { constructor(private router: router, private github: github) {} searchfororg(orgname: string) { this.github.getorg(orgname) .subscribe(({name}) => { console.log(name); this.router.navigate(['repolist', {org: orgname}]); }); } }
to github can give anchor element href
<a href="/github/repo-list/angular"> github repos </a>
Comments
Post a Comment