Tengo un inicio de sesión único pero para probar quiero leer los valores de la url localhost:4200/?id=test&name=testing&email=testing@test.com y pasarlos a una API en el componente de la aplicación.
habrá una bandera en base a la cual leeré de la URL en lugar de usar la función de inicio de sesión único
if (url_enabled == true) { getParamsFromUrl() } else { singleSignOn() }Probé ActivatedRoute pero parece que no funciona.
queryParams, params, url, queryParamsMap pero ninguno de estos parece estar funcionando. todo lo que obtengo es un valor vacío.
componente interno de la aplicación
aplicación.componente.ts
getParamsFromUrl() { this._router.events.subscribe((e) => { if (e instanceof NavigationEnd) { console.log(e.url) } }) } this.route.queryParams.subscribe(params => { console.log(params); })aplicación.componente.html
<router-outlet></router-outlet>app-routing.module.ts
const routes: Routes = [ {path:'*/:id', component: AppComponent}, ];Probé todo lo que pude encontrar en stackoverflow u otros blogs. ¿Alguien puede señalar lo que me estoy perdiendo aquí?
Para esta ruta: Puedes probar de esta manera:
const routes: Routes = [ {path:'*/:id', component: AppComponent}, ];En el archivo AppComponent .ts:
constructor( private activatedRoute: ActivatedRoute, ) { } ngOnInit() { this.activatedRoute.params.subscribe(params => { const id = params['id']; console.log('Url Id: ',id); } OR ngOnInit() { this.activatedRoute.queryParams.subscribe(params => { const id = +params.id; if (id && id > 0) { console.log(id); } }); }en primer lugar, hay una url con queryParams como la tuya:
localhost:4200/?id=test&name=testing&email=testing@test.com
de esta manera, llegará a los parámetros de consulta con el objeto ActivatedRoute como:
this.name = this.activatedRoute.snapshot.queryParamMap.get('name'); // this.name = 'testing'O :
this.activatedRoute.queryParams.subscribe(params => { this.name= params['name']; });y la otra forma es
localhost:4200/prueba/prueba/prueba@prueba.com
utiliza para la recuperación de sincronización (una vez):
this.name = this.activatedRoute.snapshot.ParamMap.get('name');Angular nos viene con el objeto ActivatedRoute. Podemos acceder al valor del parámetro URL de la misma manera que se hizo anteriormente con poca diferencia. Se puede acceder a los datos de este tipo de dos maneras diferentes. Uno es a través de route.snapshot.paramMap y el otro es a través de route.paramMap.subscribe. La principal diferencia entre los dos es que la suscripción continuará actualizándose a medida que cambie el parámetro para esa ruta específica.
ngOnInit() { this.route.paramMap.subscribe(params => { this.userType = params.get("userType") }) }