1

I am trying to implement routing with id parameter on the url such as localhost:1000/register/id Using that path will always trigger system is not defined while other urls without parameters are working fine. I even tried following the guide from angular.io's routing format doesn't seems to fix the problem. What am I missing in my code?

enter image description here

app.routing.ts

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { RegisterComponent } from './registration/register.component';
import { CodeComponent } from './registration/code.component';

const appRoutes: Routes = [
    {
        path: 'register/:id',
        component: RegisterComponent
    },
    {
        path: '',
        component: CodeComponent
    }
];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';

import { routing } from './app.routing';
import { AppComponent } from './app.component';
import { CodeComponent } from './registration/code.component';
import { RegisterComponent } from './registration/register.component';

@NgModule({
    imports: [BrowserModule, HttpModule, FormsModule, routing],
    declarations: [AppComponent, CodeComponent, RegisterComponent],
    bootstrap: [AppComponent]
})
export class AppModule { }

server.js

var express = require('express'),
    app = express(),
    mongoose = require('mongoose'),
    bodyParser = require('body-parser'),
    path = require('path'),
    passport = require('passport'),
    session = require('express-session'),
    port = process.env.PORT || 1000;

db = require('./config/db');
mongoose.Promise = global.Promise;
mongoose.connect(db.url);

app.use(session({
    secret: 'test',
    saveUninitialized: true,
    resave: true
}));

app.use(passport.initialize());
app.use(passport.session());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
require('./config/passport')(passport);
require('./routes/main')(app, passport);

app.use(express.static(path.join(__dirname)));
app.use('/node_modules', express.static(path.join(__dirname+ '/node_modules')));
console.log(path.join(__dirname+ '/node_modules'))

app.all('/*', function (req, res, next) {
    res.sendFile('/view/index.html', { root: __dirname });
});

app.listen(port);
console.log('Magic happens on port ' + port);

UPDATE:

By using this.router.navigate(['/register', '1']); works perfectly, but by typing on the url localhost:1000/register/1 is not working

enter image description here

From the picture above, there is mouse hover showing the url to be localhost:1000/register/node_modules/core-js.... - I think there is something I've missed in my server NodeJS side.

I've also added

app.use('/node_modules', express.static(__dirname + '/node_modules'));

But no changes

Note: Server side (NodeJS,Express)

Gene Lim
  • 1,068
  • 2
  • 14
  • 36

0 Answers0