2016-10-03 2 views
0

Ich habe eine Form wie unten:Wie kann ich Keyup Loopback in Winkel 2 deaktivieren?

<div *ngIf="formLabel" style="padding: 0 16px"> 
      <md-input [(ngModel)]="label.Name" placeholder="Label name" style="width: 100%"> 
      </md-input> 
     </div> 
     <md-list-item *ngFor="let label of labels"> 
      <h3 md-line> 
       <md-icon class="fa fa-tag" fontSet="fa" fontIcon="fa-tag" (click)="openFormLabel(label)"></md-icon> 
       <a routerLink="/label/{{label.Id}}">{{label.Name}}</a> 
      </h3> 
</md-list-item> 

Wie kann ich {{}} labe.Name Auto binden Text, wenn ich eingeben md-ipnut deaktivieren?

+0

Also, wenn Sie aktualisieren 'gehen {{label.Name}}'? Ich glaube nicht, dass eine Art der Bindung das lösen wird. – choz

+0

@choz sehe meine Updates. – micronyks

+0

@micronyks Ihre Lösung wird gut funktionieren. Aber ich wundere mich nur, warum er die "label.Name" Interpolation verwendet, wenn er nicht beabsichtigt, sie zu aktualisieren, wenn sich der Wert ändert. Ofc, lassen Sie die Tatsache beiseite, wenn er es aktualisieren will, sobald ein Ereignis auftritt. – choz

Antwort

3

Dafür verwenden einen Weg Bindung wie,

[ngModel]="label.Name" 

aktualisieren:

Wenn Sie label.Name Wert nach Abschluss der Eingabe, aktualisieren bestimmt sind, können Sie Verwenden Sie Unschärfe Ereignis wie hier gezeigt zusammen mit One-Way

<form #f='ngForm' (ngSubmit)="onSubmit(f.form)"> 

      <input (blur)="changeValue(f.form)" //<<<===here 
       type="text" #Name="ngModel"  
       [ngModel]="label.Name" 
       name="Name" > 
</form> 


export class AppComponent { 

     label={}; 

     onSubmit(f){ 
      console.log(f.controls.Name.value) 
     } 
     changeValue(f){ 
      this.label.Name=f.controls.Name.value; 
     } 

} 

Demo Bindung: https://plnkr.co/edit/D317OeHapT9m4DxgGvO1?p=preview

+0

Nach der Arbeit mit Ihrer Demo denke ich, dass dies ein Weg ist, mein Problem zu lösen. Ich danke dir sehr :) –