Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

515
Views
¿Cómo enviar un formulario al servidor en Angular2?

Ahora el envío ha sido capturado por angular2 incluso con action= en el <form>.

enlace de demostración: http://plnkr.co/edit/4wpTwN0iCPeublhNumT5?p=preview

 //our root app component import {Component} from 'angular2/core' @Component({ selector: 'my-app', providers: [], template: ` <div> <h2>Hello {{name}}</h2> <form action="https://www.google.com" target="_blank" method="POST"> <input name="q" value="test"> <button type="submit">Search</button> </form> </div> `, directives: [] }) export class App { constructor() { this.name = 'Angular2' } }
over 4 years ago · Santiago Trujillo
3 answers
Answer question

0

Debe aprovechar la directiva NgSubmit , como se describe a continuación:

 <form (ngSubmit)="onSubmit()" #heroForm="ngForm"> (...) <input type="text" [(ngModel)]="data.name"/> (...) <button type="submit">Send</button> </form>

En este caso, cuando haga clic en el botón Enviar, se llamará al método onSubmit del componente y podrá enviar datos manualmente al servidor utilizando la clase HTTP en Angular2:

 @Component({ }) export class MyComponent { constructor(private http:Http) { this.data = { name: 'some name' (...) }; } onSubmit() { this.http.post('http://someurl', JSON.stringify(this.data)) .subscribe(...); } }

De esta manera puede permanecer en la misma página página.

Editar

Después de su comentario, debe deshabilitar el comportamiento de la directiva NgForm que detecta el evento de submit y evita que se propague. Consulte esta línea: https://github.com/angular/angular/blob/master/modules/%40angular/forms/src/directives/ng_form.ts#L141 .

Para hacerlo, simplemente agregue el atributo ngNoForm a su formulario:

 <form ngNoForm action="https://www.google.com" target="_blank" method="POST"> <input name="q" value="test"> <button type="submit">Search</button> </form>

En este caso, se abrirá una nueva ventana para enviar el formulario.

Espero que te ayude Thierry

over 4 years ago · Santiago Trujillo Report

0

Prueba esto:

 <form action="https://www.google.com" target="_blank" method="POST" #form> <input name="q" value="test"> <button type="submit" (click)="form.submit()">Search</button> </form>

http://plnkr.co/edit/Qjh8ooPpkfVgEe0dIv4q?p=vista previa

over 4 years ago · Santiago Trujillo Report

0

También puede enviar el formulario de esta manera.

Aquí está el marcado HTML.

 <form (ngSubmit)="onSubmit($event)" #f="ngForm"> (...) <input type="text" [(ngModel)]="data.name"/> (...) <button type="submit">Send</button> </form>

Y aquí está el código en su archivo .ts .

 onSubmit(e) { e.target.submit(); }
over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!