Tengo un formulario tipo 'plantilla' muy simple que tiene solo 2 inputs y 1 botón de submit, no tengo manera que hacer que el atributo 'required' funcione, lo ignora completamente. Por lo demás funciona bien, al hacer submit los datos se imprimen correctamente por consola. Estoy usando Angular 17. Por si ayuda de algo la aplicación fue creada basada en la API Standalone, por lo que no tiene ngModules.
Plantilla:
<form (submit)="submit($event)">
<div>
<label for="user">
Username:
</label>
<input [(ngModel)]="user" name="user" placeholder="Michael123" required>
</div>
<div>
<label for="password">
Password:
</label>
<input [(ngModel)]="password" name="password" placeholder="somepassword" required>
</div>
<button type="submit">Login</button>
</form>
Componente:
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
@Component({
selector: 'app-template-form',
standalone: true,
imports: [FormsModule],
templateUrl: './template-form.component.html',
styleUrl: './template-form.component.css'
})
export class TemplateFormComponent {
public user: string = ''
public password: string = ''
submit(e: SubmitEvent) {
e.preventDefault()
let data = new FormData(e.target as HTMLFormElement)
console.log({
user: data.get('user'),
password: data.get('password')
})
}
}
No tengo mucha experiencia con el framework, sepan entender.