De repente, de la nada, sin nada modificado o actualizado, cada vez que presiono un botón para enviar algunos datos a la base de datos backend falsa de mi aplicación ( json server API ), la página se vuelve a cargar.
Esto sucede en Chrome y Firefox y Edge .
Busqué y encontré algunas sugerencias (por ejemplo , aquí ) para cambiar el tipo de botón de envío de type="submit" a type="button" pero esto no funciona para mí, porque entonces los datos de mi formulario no se envían.
¿Hay alguna manera de hacer esto programáticamente? ¿Alguien se ha encontrado con esto últimamente?
pd Por ahora, no estoy 'observando' mi 'db.json' como una solución para evitar este problema, pero tengo que solucionarlo para poder ejecutar json server API ...
EDITAR
Este es mi código de form :
<form #postForm="ngForm" (ngSubmit)="onAnnotateSelection(postForm.value)"> <div class="form-group"> <textarea name="chosenTitle" rows="1" class="form-control" placeholder="Enter a title for your annotation here..." [(ngModel)]="chosenTitle"> </textarea> <textarea name="highlightedText" id="selectedText" rows="3" class="form-control" placeholder="Your highlighted text will appear here..." [(ngModel)]="highlightedText" (mouseup)="mouseUp()"> </textarea> </div> <button class="btn btn-outline-success" type="submit" [disabled]="!postForm.valid"> Annotate your highlighted/selected Text </button> <a class="btn btn-secondary active" role="button" [href]="fileUrl" download="annotations.txt"> Download All Annotations </a> </form> Este código estaba bien. Dudo que haya algo en el código del formulario. Sospecho que algo en mi package-lock.json cambia, porque este archivo de bloqueo solía estar en mi archivo gitignore , luego supe que en realidad debería estar bajo el control de versiones, así que lo hice. ¿Podría tener algo que ver con los cambios en el archivo de bloqueo?
Puede dejar de enviar el formulario y utilizar
<button class="btn btn-outline-success" type="button" [disabled]="!postForm.valid" (click)="onAnnotateSelection(postForm.value)"> Annotate your highlighted/selected </button> También debe eliminar el ngSubmit del elemento de form .