How to navigate to nested router via code

Question

How can I create this link via code:
'foo' being the name of the router-outlet, and 'bar' the name of the component.
http://localhost:8000/Home/(foo:bar)

I used to do it in HTML like this:

<a [routerLink]="[{outlets: {foo: ['Bar']}}]">Bar</a>

But I'm unable to navigate to the same URL via code:

this._router.navigate([{ outlets: { foo: bar} }], { relativeTo: this._route });

In the console I get this:

NavigationError(id: 3, url: '/Home(foo:bar)', error: Error: Cannot match any routes. URL Segment: 'bar')

This / between 'Home' and '(foo:bar)' is missing: /Home/(foo:bar)'

Update based on comment:
I have a page 'Home' that contains my navigation bar. Under that navigation bar I have a 'named router-outlet' that displays the pages that users browse to.

Answer 1

I had to add the prefix myself:

this._router.navigate(['Home', { outlets: { foo: bar} }]);