user1592129
user1592129

Reputation: 493

ng-repeat and databinding in not working

I am new to Angularjs and trying to do something like:

<div ng-repeat="size in sizes">
    {{size.name}} 
    <input  ng-model="price_{{size.id}}" required type="number">
</div>

I have read about how ng-repeat and data binding works. but can't understand how to solve such problem, My product may have many sizes and I want to display so many input boxes as the number of sizes. So that I can enter a price for each size.

Upvotes: 0

Views: 48

Answers (2)

Engineer
Engineer

Reputation: 48793

Instead of concating variables with _ in the model, use data structure. For example declare price as an object,which properties are ids of sizes.In that case you can write:

<input  ng-model="price[size.id]" required type="number">

Or declare price as an array, and use $index instead of size.id,if it's not so important:

<input  ng-model="price[$index]" required type="number">

Upvotes: 1

Marcel Gwerder
Marcel Gwerder

Reputation: 8520

If you just want to specify a price per size, why not assign the price to a property of size?

<input ng-model="size.price" type="number" required>

Otherwise you can define prices as an object in your controller:

$scope.prices = {};

And create a property per id:

<input ng-model="prices[size.id]" type="number" required>

Upvotes: 1

Related Questions