В угловом 2+ мы обрабатываем образует два способа:
- Шаблона с приводом
- Реактивной
Здесь я делюсь кодом для простых форм на основе шаблонов. Если вы хотите сделать это с помощью реактивных форм затем проверить эту ссылку: Angular2 reactive form confirm equality of values
Ваш файл модуля должен иметь следующие:
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)
Простая регистрация HTML файла:
<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>
Теперь ваши registration.ts файл должен быть таким:
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.
}
}
Для обработки этих данных на стороне сервера используйте эту ссылку: How to post json object with Http.post (Angular 2) (php server side). Я думаю, что этого более чем достаточно.
проверить эту ссылку ... http://stackoverflow.com/questions/41154319/how-to-post-json-object-with-http-post-angular-2-php-server-side –
@AmitSuhag, Я хочу знать, как связать данные формы с помощью события click и onSubmit. И тогда, как это сделать. Можете ли вы мне помочь со всем пакетным решением ... Это будет очень полезно для меня ... –