input box value not printed

Question

Code:

<div class="row" *ngIf="goalStatusList;" >
  <table class="table table-hover">
    <thead>
    <tr>
      <td>Id</td>
      <td>Name</td>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let goalStatus of goalStatusList">
      <th>{{goalStatus.goalStatusId}}</th>
      <td><div *ngIf="!(goalStatus.editorEnabled)">
{{goalStatus.goalStatusName}}
<md-icon (click)="goalStatus.editorEnabled=true;">mode_edit</md-icon></div>
  <div *ngIf="(goalStatus.editorEnabled)" ><md-input-container><input mdInput value="goalStatus.goalStatusName" #goalName></md-input-container><md-icon (click)="modifyGoal()" style="color:green;font:bold;" >done</md-icon><md-icon (click)="goalStatus.editorEnabled=false" style="color:red;font:bold;" >clear</md-icon></div></td>
    </tr>
    </tbody>
  </table>
</div>

The mdInput field above does not print the goalStatusName value. Instead it simply prints goalStatus.goalStatusName.

score 0 · Accepted Answer · answered Sep 03 '17 at 10:00

0

There are two issues here

Your ngIf should be without brackets,

<td><div *ngIf="!goalStatus.editorEnabled">

and use expression in case of value

<input mdInput value="{{goalStatus.goalStatusName}}" #goalName>

answered Sep 03 '17 at 10:00

Sajeetharan

216,225
63
350
396

How do I implement two-way binding in here? – HBK Sep 03 '17 at 10:22
you should use ngModel – Sajeetharan Sep 03 '17 at 10:23
Tried. Getting error: `Can't bind to 'ng-model' since it isn't a known property of 'input'. ("dit`. My code: `` – HBK Sep 03 '17 at 10:24
https://stackoverflow.com/questions/43298011/angular-4-cant-bind-to-ngmodel-since-it-isnt-a-known-property-of-input/43298039#43298039 – Sajeetharan Sep 03 '17 at 10:25
Solved: `` – HBK Sep 03 '17 at 10:28
I did:(. One more... https://stackoverflow.com/questions/46022971/set-button-to-appear-on-hover – HBK Sep 03 '17 at 11:28
@RahulSingh Both nice answers. Thnx for help. – HBK Sep 03 '17 at 12:00
@KrishnakantSarda now you should be able to do – Sajeetharan Sep 03 '17 at 12:01
There is nothi g wrong with OP's `*ngIf`. Also, using `[value]="row.goalStatusName"` also works. – FAISAL Sep 03 '17 at 15:32

input box value not printed

1 Answers1