当我在控制台中看到来自表单的数据时,它会得到两次
我的模板
<div class="login jumbotron center-block">
<h1>Login</h1>
<form #form ="ngForm" (ngSubmit)="onSubmit(form.value)">
<div class="form-group">
<label for="username">Username</label>
<input type="text" ngControl ="email" class="form-control" id="emailh" placeholder="Username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" ngControl ="phone" class="form-control" id="phoneh" placeholder="Password">
</div>
<button type="submit" class="btn btn-default">Submit</button>
<a [routerLink]="['/signup']">Click here to Signup</a>
</form>
</div>
我的组件,
import { Component } from '@angular/core';
import { Router, ROUTER_DIRECTIVES } from '@angular/router';
import { CORE_DIRECTIVES, FORM_DIRECTIVES } from '@angular/common';
import { Http, Headers } from '@angular/http';
import { contentHeaders } from '../headers/headers';
import {Control,FormBuilder,ControlGroup,Validators} from '@angular/common';
@Component({
directives: [ ROUTER_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES ],
templateUrl : "./components/login/login.html",
})
export class Login {
constructor(public router: Router, public http: Http) {
}
onSubmit(form:any) {
console.log(form);
}
}
我的控制台,
Object {email: "andrew@gmail.com", phone: "getiyt"}
Object {email: "andrew@gmail.com", phone: "getiyt"}
当我看到来自控制台中的表单的数据时,它会得到两次,因此我不确定为什么会这样,因此我的数据库也会被单个记录填充2次。有人找到我的位置我错了。
答案 0 :(得分:1)
在你的main.ts中你必须设置:
import {disableDeprecatedForms, provideForms} from '@angular/forms';
bootstrap(AppComponent, [disableDeprecatedForms(), provideForms()]);
这解决了这个问题。看到这个plunker:http://plnkr.co/edit/uiYZkEWMyXWOkglHZu6N
另请参阅官方文档:https://angular.io/docs/ts/latest/guide/forms.html
信用:Roberto Simonetti answer在这里。