Parece ser algo básico, pero estoy luchando. Tengo una vista "/plugin/{pluginId}" que no se actualiza cuando presiono enter después de cambiar el pluginId en la barra de direcciones. Tengo que actualizar manualmente la página en el navegador. ¿Qué puedo hacer para que se actualice automáticamente?
<div> <div> <a mat-raised-button href="/plugin"> <span>←</span> </a> <a mat-raised-button href="" style="float: right">Send message</a> </div> <div> <ul> <li *ngFor="let message of (messages$ | async)"> {{message.message}} <br><br> </li></ul> </div> </div> export class Foo implements OnInit { pluginMessagesState$: Observable< fromPluginMessages.State >; pluginId = ''; messages$: Observable< Message[] >; constructor(private route: ActivatedRoute, private store: Store< fromRoot.State >, ) { if ( this.route.snapshot.params[ 'pluginId' ] ) { this.pluginId = this.route.snapshot.params[ 'pluginId' ]; } this.pluginMessagesState$ = this.store.select( fromRoot.getPluginMessagesState ); this.messages$ = this.pluginMessagesState$.pipe( map( state => state.pluginMessages.get( this.pluginId )?.list || [] ) ); } ngOnInit(): void { } }import { ActivatedRoute } from '@angular/router'; @Component({ selector: 'app-user-detail', templateUrl: 'user-detail.component.html' }) export class UserDetailComponent implements OnInit { constructor(private activeRoute: ActivatedRoute) { } ngOnInit() { const queryParams = this.activeRoute.snapshot.queryParams const routeParams = this.activeRoute.snapshot.params; // do something with the parameters this.loadUserDetail(routeParams.id); } }o
ngOnInit() { this.activeRoute.queryParams.subscribe(queryParams => { // do something with the query params }); this.activeRoute.params.subscribe(routeParams => { this.loadUserDetail(routeParams.id); }); }¿El archivo de su enrutador se ve así?
{path: 'plugin/:id', component: UserDetailComponent}Si es así, suscríbase a ActivatedRoute (inyéctelo en los parámetros del constructor) así:
public pluginId: number; constructor(private route: ActivatedRoute) { }Y acceda al parámetro suscribiéndose a route.params:
ngOnInit() { this.routeSub = this.route.params.subscribe(params => { // update the pluginId accordingly this.pluginId = params['id']; }); }