Angular - how to update a URL parameter programatically

Suppose I have a component which displays the list of actors for a movie. After an actor is selected, some details about that particular actor will be displayed on the same component.

My goal is to include the movie id and actor id in the URL. Also, when a new actor is selected, the actor id from the URL should change accordingly.

The URL should have the following form: /movies/movieId/actors/actorId

So I have one component which will need to do the following:

1. get the movie id
2. for that movie id, get the list of actors
3. if no actor id was supplied, select the first actor and modify the URL accordingly
4. if an actor id was supplied, select that actor and don't modify the URL
5. modify the actorId from the URL whenever the user selects an actor from the list

I'm not exactly sure what is the best solution for updating a URL parameter. At the moment, I'm using the following solution:

routing configuration:

path: ':movieIdId',
      component: MoviesComponent,
      children: [
        {
          path: 'actors',
          component: ActorsComponent
        },
        {
          path: 'actors/:actorId',
          component: ActorsComponent
        }
]

And for updating the URL I do the following:

updateActorId(actorId: number) {
    this.router.navigate(['movies', this.movieId, 'actors', actorId]);
}