Angular 17 ROUTER input PARAMS como usarlo - withComponentInputBinding
Вставка
- Опубліковано 4 жов 2024
- Angular 17 ROUTER input PaRAMS como usarlo - withComponentInputBindingUna de las nuevas características en Angular v17 es el
mapeo automático de parámetros de ruta utilizando el decorador Input.
Significa que podemos usar una propiedad de entrada para leer automáticamente los parámetros de ruta, en lugar de usar el servicio Activated Route.
Esto nos brinda una sintaxis más corta y fácil.
Lista completa:
• Consumiendo API de ter...
🤝🏻Sé parte de la comunidad Domini code..!!
/ @dominicode
▶️ Curso de Angular 9 Udemy:
www.udemy.com/...
▶️ Tutorial de Angular desde cero:
• Angular desde cero 🅰 C...
▶️ 28 días aprendiendo Angular:
• ¿Qué es Angular? & Ins...
📩 Contacto: Dominicode.contacto@gmail.com
👨🏻💻 Website: dominicode.com
📲 Instagram: / domini_code
📹 Twitter: / domini_code
💻 LinkedIn: / dominicode
📂 GitHub: github.com/dom...
🎥 Twitch: / dominicode_live
el archivo app.config.ts no existe en las aplicaciones que usaban los ngModules tradicioinales y el 'antiguo' main.ts usaba la funcion bootstrapModuleFactory para indicarle el modulo de arraque de la aplicacion
Excelente!
Eso es muy muy muy muy chulo si pones withcomponentInputBinding, te olvidas de snapshot y params.
pero del dia 3 al 4 a cambiado mucho el codigo...Acaso aqui no esta completos los videos?
mi pregunta es ¿cómo tomar varios parametros, por ejemplo : api/users?sortBy=name&orderBy=desc ???
Se hacen varios @Input?... voy a hacer pruebas...
No se si ya has encontrado la respuesta.
podrías hacerlo definiendo los parámetros con [queryParams]="{ id: 999, color: 'red'}"
Y luego recogiendo varios @Input, como te comentaba @gersonja
Hola una consulta a ver si alguien puede ayudar, funciona muy bien el ejemplo pero si recargo la pagina tira error, o si deseo cambiar manualnente desde la barra de direcciones el valor no lo toma y muestra error 404 como se puedo solucionar esto=?
Ya lo solucione! me faltaba el .. saludos!
para modulos seria habilitarlo con el bindToComponentInputs true
@NgModule({
imports: [
RouterModule.forRoot([
{ path: 'welcome', component: WelcomeComponent },
{ path: '', redirectTo: 'welcome', pathMatch: 'full' },
{
path: 'products',
loadChildren: () =>
import('./products/product.module').then(m => m.ProductModule)
},
{ path: '**', redirectTo: 'welcome', pathMatch: 'full' }
], { bindToComponentInputs: true })
],
exports: [RouterModule]
})