Hoy quiero compartir una solución sencilla y eficiente para crear campos dinámicos en formularios desde el frontend, utilizando Angular y Node.js con Express.
🔑 Frontend: El formulario es flexible y genera dinámicamente los campos iterando sobre un array, lo que permite que nuevos campos se integren sin tocar el código base.
<div *ngFor="let columna of columnas">
<label>{{ columna }}</label>
<input [(ngModel)]="persona[columna]" />
</div>
🛠️ Backend: Cuando el usuario añade un nuevo campo, enviamos una solicitud POST a nuestro servidor, el cual ajusta la tabla de la base de datos en PostgreSQL para incluir este nuevo campo de manera dinámica.
app.post('/personas/add-field', async (req, res) => {
const { name, type } = req.body;
await pool.query(`ALTER TABLE persona ADD COLUMN ${name} ${obtenerTipoSQL(type)}`);
res.status(200).json({ message: 'Campo agregado exitosamente' });
});
Con esta solución, puedes escalar tu aplicación y adaptarte a los requerimientos cambiantes sin romper la estructura existente. 🌟
Top comments (1)
In this post, I'm going to discuss why and how to use TypeScript to type React components. You'll... dev.to/drlacheheb/typescript-with-...