2016-07-23 7 views
0

ログインフォームを作成しようとしていますが、1回のクリックでコンソールに2回フォームの値が表示され、どこにエラーがあるのか​​わかりません。 ...ワンクリックでフォームにデータが2回表示される

私のテンプレート

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 class="btn btn-default">Submit</button> 

</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); 
} 
    } 

私がログインフォームを作成しようとしていますが、それはワンクリックでフォームの値にコンソールで2回を示しており、私はないです確かにどこにe rrorがいずれかのエラーを見つけることができた....

+0

からのみ古い形式のモジュールに

import {disableDeprecatedForms, provideForms} from '@angular/forms'; bootstrap(AppComponent, [disableDeprecatedForms(), provideForms()]); 

を無効に必要と輸入フォーム関連のものだと思いますhttp://embed.plnkr.co/w2FVfKlWP72pzXIsfsCU/ – Milad

答えて

0

私はあなたがそれは一度だけだ@angular/forms代わりの@angular/common

関連する問題