Achtung: Es sollteAngular2 Neues Formular API: Formular ohne Bindungen ihrer Elemente
mit the new forms API! arbeiten Gibt es eine Möglichkeit, eine Rohform ohne Bindungen ihrer Elemente einreichen?
Ein Beispiel:
<div class="form-mantle">
<form (ngSubmit)="onSubmitForm1(f1.value)" #f1="ngForm">
<input ngControl="name1" name="name1" type="text" required/><br/>
<input ngControl="text1" name="text1" type="text" required/><br/>
<button class="btn btn-primary" [disabled]="!f1.form.valid">Next </button>
</form>
</div>
<pre>
{{ form1 | json }}
</pre>
Wie sollte onSubmitForm1() aussehen, so dass ich form1 erhalten wie unten wiedergegeben:
{
name1: "Michael Jackson",
text1: "They don't really care about us"
}
Ich habe preapared bereits eine Komponente + zu kopieren einfügen, für diejenigen, die helfen wollen:
import { Component } from '@angular/core';
@Component({
moduleId: module.id,
selector: 'form1',
templateUrl: 'form1.component.html',
styleUrls: ['form1.component.css']
})
export class Form1Component {
form1 : any = {};
constructor() { }
onSubmitForm1 (data?:any) {
// get raw data from form without bindings
this.form1 = data;
console.log("Data", data);
return false;
}
}
Bearbeiten: T Die genaue Arbeitskopie in PLNKR (http://plnkr.co/edit/nMPTYLGxgWzzJuD9Be3f?p=preview) funktioniert nicht innerhalb des Seeds von https://github.com/mgechev/angular2-seed. Vielleicht ist es ein Versions-Problem ??
Doppelbindungs Arbeiten ohne Fehler:
<div class="form-mantle">
<form (ngSubmit)="onSubmitForm1(f1.value)" #f1="ngForm">
<input [(ngModel)]="f1.name1" #name="ngModel" name="name1" type="text" required/><br/>
<input [(ngModel)]="f1.text1" #name="ngModel" name="text1" type="text" required/><br/>
<button class="btn btn-primary" [disabled]="!f1.form.valid">Next </button>
</form>
</div>
<pre>
{{ f1.value | json }}
</pre>
Ich habe es versucht, jetzt und (f1.value) tut leider nichts:/ –
Überprüfen Sie diesen Plunker: http://plnkr.co/edit/nMPTYLGxgWzzJuD9Be3f?p=preview – rinukkusu
versuchen, ........ –