Unable to get params Node and Angular - node.js

Question

I have a list of todos that are fetched from MongoDB and they are displayed on one page and when I click on one it opens on another page with URL that equals clicked todo. Now I am trying to get the id from URL and send it to node server but I can't get it.
ngOnInit() {
this.route.params
.subscribe(
(params: Params) => {
let todoId = params['userId'];
console.log(todoId);
}
);
}
console returns undefined.
I found one solution where id is fetched by this line of code, but it only gets id once and when I click on another todo it doesn't log anything.
let id = this.route.snapshot.paramMap.get('id');
console.log(id)
And when I want to send request to server with this:
let id = this.route.snapshot.paramMap.get('id');
this.todoService.getSingleTodo(id)
.subscribe(
(todo: Todo) => {
this.todo = todo;
console.log(todo);
}
);
I got this error in console "message":"Cast to ObjectId failed for value \":id\" at path \"_id\"
Service looks like this:
getSingleTodo(id) {
return this.http.get('http://localhost:3000/todos/:id')
.map( response => response.json().obj)
.map( todo => todo.map(todo => new Todo(todo.todoHeadline,
todo.todoDescription, todo._id)));
}
And node file:
router.get('/:id', (req, res, next) => {
console.log(req.params.id);
Todo.findById(req.params.id, (err, singleTodo) => {
if (err) {
return res.status(500).json({
title: 'An error occured',
error:err
});
}
res.status(201).json({
message: 'Success',
obj: singleTodo
});
});
});
Also this console prints :id.
Main routing file
const APP_ROUTES: Routes = [
{ path: '', redirectTo: '/auth', pathMatch: 'full' },
{ path: 'todos', component: TodoComponent, children: TODO_ROUTES},
{ path: 'auth', component: AuthenticationComponent, children: AUTH_ROUTES }
];
And children routes for todos
export const TODO_ROUTES: Routes = [
{path: 'todo/add', component: TodoAddComponent},
{path: ':id', component: TodoListComponent},
{path: 'edit', component: TodoEditComponent}
];
HTML where all todos are displayed lools like this
<ul class="list-group">
<li class="list-group-item"
*ngFor="let todo of todos;"
[routerLink]="['/todos', todo.todoId]">{{todo.todoHeadline}}
</li>
</ul>
What could be the problem?

Answer 1

It's this line right here that's wrong:
let todoId = params['userId'];
In your Routing, you defined that the path variable would be named "id":
{path: ':id', component: TodoListComponent},
So when you try to access a path variable userId, it obviously returns undefined.