2016-12-17 6 views
13

Ich habe ein Formular in meinem eckigen 2 Projekt.Wie bekomme ich Formulardaten in Angular 2

Ich weiß, wie Sie Daten von der API abrufen. Aber ich weiß nicht, wie man dort eine CRUD-Operation durchführt.

Kann hilft mir jemand mit dem einfachen Codes auf, wie Formulardaten im JSON-Format an einen Web-Service in PHP senden/jede anderen Sprache ...

Hilfe wird geschätzt. Dank

+0

check this link ... http://stackoverflow.com/questions/41154319/how-to-post-json-object-with-http-post-angular-2-php-server-side –

+0

@AmitSuhag, Ich möchte wissen, wie man die Formulardaten durch click-Ereignis und onSubmit-Methode bindet. Und dann, wie man es stringt. Können Sie mir mit einer ganzen Paketlösung helfen ... Es wird sehr hilfreich für mich sein ... –

Antwort

22

In Angular 2+ behandeln wir Formen zwei Möglichkeiten:

  • Template-driven
  • Reactive

Here I Code teilen bin für einfache Template-driven Formen. Wenn Sie wollen es mit reaktiven Formen dann auf diesen Link überprüfen: Angular2 reactive form confirm equality of values

Ihre Moduldatei sollte diese haben:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic' 
import { ReactiveFormsModule, FormsModule } from '@angular/forms'; 
import { MyApp } from './components' 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    ReactiveFormsModule 
    ], 
    declarations: [MyApp], 
    bootstrap: [MyApp] 
}) 
export class MyAppModule { 

} 

platformBrowserDynamic().bootstrapModule(MyAppModule) 

Einfache Registrierung html-Datei:

<form #signupForm="ngForm" (ngSubmit)="registerUser(signupForm)"> 
    <label for="email">Email</label> 
    <input type="text" name="email" id="email" ngModel> 

    <label for="password">Password</label> 
    <input type="password" name="password" id="password" ngModel> 

    <button type="submit">Sign Up</button> 
</form> 

Jetzt ist Ihre registration.ts Datei sollte so aussehen:

import { Component } from '@angular/core'; 
import { NgForm } from '@angular/forms'; 

@Component({ 
    selector: 'register-form', 
    templateUrl: 'app/register-form.component.html', 
}) 
export class RegisterForm { 
    registerUser(form: NgForm) { 
    console.log(form.value); 
    // {email: '...', password: '...'} 
    // ... <-- now use JSON.stringify() to convert form values to json. 
    } 
} 

Um diese Daten zu behandeln Auf der Serverseite verwenden Sie diesen Link: How to post json object with Http.post (Angular 2) (php server side). Ich denke, das ist mehr als ausreichend.

+0

Super! Vielen Dank für die Hilfe zu diesem Thema –

Verwandte Themen