When loading my application on routers without parameters, everything is normal. However, when trying to use a router with params, the application fails to load.
For example: localhost:3000/usersid/:id
The code for the router is as follows:
const appRoutes: Routes = [
{ path: 'user', component: UserComponent },
{ path: 'info', component: InfoComponent },
{ path: 'users', component: UsersComponent },
{ path: 'usersid/:id', component: UsersIdComponent },
{ path: '', component: MainComponent },
{ path: '**', component: MainComponent }
];
Below is the component handling the params in the router:
import{Component} from '@angular/core'
import { ActivatedRoute } from '@angular/router';
import * as Datastore from 'nedb';
@Component({
moduleId : module.id ,
templateUrl : 'userid.component.html' ,
styles : [`
.SamRouter {
overflow-y: auto;
}
`]
})
export class UsersIdComponent {
id: any;
private sub: any;
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.sub = this.route.params.subscribe( params => {
// this.id = +params['id']; // (+) converts string 'id' to a number
this.id = params['id'] || 0 ;
// In a real app: dispatch action to load the details here.
});
console.log( this.id )
}
ngOnDestroy() {
// this.sub.unsubscribe();
}
}
Error Message:
http://localhost:3000/users/node_modules/bootstrap/dist/js/bootstrap.min.js Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:3000/users/styles.css Failed to load resource: the server responded with a status of 404 (Not Found)