angularjs set value of input box based on the condition

Question

I have a JSON data getting from server.

$scope.denominations = [
    {
        "code": "190",
        "description": "One Coin",
        "count": null,
        "multiplier": 1
    },
    {
        "code": "170",
        "description": "Five Coin",
        "count": null,
        "multiplier": 5
    },
    {
        "code": "150",
        "description": "Strapped 2",
        "count": null,
        "multiplier": 200
    }
]

view

<table class="custom-table table-bordered table">
    <tr>
     <th>Denomination</th>       
     <th class="text-center">Amount</th>
    </tr>
    <tr data-ng-repeat="denom in denominations">
     <td class="centerText"><input type="text" class="form-control" name="denomCount" data-ng-model="denom.count" readonly></td>
     <td class="centerText"><input type="text" class="form-control" name="denomamount{{$index}}" data-ng-model="(denom.count != 'null') ? (denom.count * denom.multiplier) : '0.00'"></td>
</tr>
</table>

Based on the condition, i need to set the value of input text box. the conditions are i added in the model, but it is giving error saying: non assign model value

data-ng-model = "if (denom.count != 'null') ? (denom.count * denom.multiplier) : '0.00'"

Error: [ngModel:nonassign] errors.angularjs.org/1.3.15/ngModel/…! — vishnu
– vishnu, Commented Apr 24, 2015 at 9:42

Weedoze · Accepted Answer · 2015-04-24 09:48:50Z

1

You can do it by using a ng-if condition

HTML

<table class="custom-table table-bordered table">
<tr>
 <th>Denomination</th>       
 <th class="text-center">Amount</th>
</tr>
<tr data-ng-repeat="denom in denominations">
 <td class="centerText"><input type="text" class="form-control" name="denomCount" data-ng-model="denom.count" readonly></td>
 <td class="centerText" data-ng-if="denom.count != 'null'"><input type="text" class="form-control" name="denomamount{{$index}}"  >{{denom.count * denom.multiplier}}</td>
 <td class="centerText" data-ng-if="denom.count == 'null'"><input type="text" class="form-control" name="denomamount{{$index}}"  >00.0</td>

</tr>
</table>

edited Apr 24, 2015 at 9:48

answered Apr 24, 2015 at 9:43

Weedoze

14k2 gold badges38 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

vishnu Over a year ago

its working, but i need to set the value in input field. but it is coming in outside input field

Weedoze Over a year ago

You can add data-ng-value inside the input

manasi sakhare · Accepted Answer · 2015-04-24 09:43:42Z

1

ng-model can be assigned a variable, but NOT an expression, as it is a two way binding. Instead you can give the expression to a variable in your JS relative scope(which could be your controller), and then assign that variable to ng-model.

Also I see that your value for ng-model is dependent on a count, so you can add a $watch on that, to keep your variable associated with ng-model updated.

edited Apr 24, 2015 at 9:43

answered Apr 24, 2015 at 9:39

manasi sakhare

1,0517 silver badges18 bronze badges

1 Comment

vishnu Over a year ago

could u give me the solution, because denom.count is in loop

Collectives™ on Stack Overflow

angularjs set value of input box based on the condition

view

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

view

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related