CODEWITHSUNDEEP
angularjs
vishnu
vishnu

Reputation: 4599

angularjs set value of input box based on the condition

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'"

Upvotes: 0

Views: 7948

Answers (2)

Weedoze
Weedoze

Reputation: 13953

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>

Upvotes: 1

manasi sakhare
manasi sakhare

Reputation: 1051

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.

Upvotes: 1

Related Questions