Angular 2 - Klicken Sie hier, um die Formularfelder zu bearbeiten

Question

Ich möchte die Bezeichnung durch Eingabetextbox ersetzen und umgekehrt, indem ich in Angular 2 auf eine Schaltfläche klicke. Ich weiß, dass ich etwas anderes verwenden muss, aber ich bin etwas verwirrt .

HTML:

<form> 
<div class="information"> 
    <label *ngIf="editMode">{{textValue}}</label> 
    <input *ngIf="editMode" [ngModel]="name"> 
    <button (click)="editMode=true">Edit</button> 
    <button (click)="editMode=false">Save</button> 
</div> 
</form> 

Answer 1

Das einzige, was Sie zu einem Ihrer *ngIf ‚s hinzufügen müssen, ist Ausrufezeichen:

<label *ngIf="!editMode">{{textValue}}</label> 

was bedeutet, dass Etikett angezeigt wird, wenn editMode falsch ist. Das Ausrufezeichen ist der NOT-Operator, der als Wahrheitstest für eine Variable verwendet wird. Mehr hier: What does an exclamation mark before a variable mean in JavaScript