How to populate data in drop down using angularjs?

Question

How to populate pModel(50gm,100gm,250gm) in drop down using Angular JS

$scope.products=
{
"shopId" : "569df5c1d08598371e9b5ad5",
"mProId" : "569e07ccd08598371ebe5409",
"priceTag" : [
        {
            "pModel" : "50gm",
            "priceTagId" : 1,

        },
        {
            "pModel" : "100gm",
            "priceTagId" : 2,

        },
        {
            "pModel" : "250gm",
            "priceTagId" : 3,

        }
    ]
}

I am doing in this way.I dont know how it wont populate .Please help me to populate this one. This is my code

<select class="form-control" id="pricetags" ng-model="selectedPriceTag" 
    ng-options="product.priceTag.pModel for product in products" > 
</select>

I am not clear if you are repeating product or price-tags.... if products then I think it should be product.priceTag[0].pModel and if you want product and then price tags as its child then you will have to use group syntax — harishr
– harishr, Commented Jun 16, 2016 at 13:52

angmerica · Accepted Answer · 2016-06-16 15:46:35Z

3

Here is a Plunker Demo

The problem is because you need to iterate through the priceTag property in products.

I recommend you update your code to the following

<select class="form-control" id="pricetags" ng-model="selectedPriceTag" 
ng-options="priceTag.pModel for priceTag in products.priceTag" > 
</select>

edited Jun 16, 2016 at 15:46

answered Jun 16, 2016 at 14:21

angmerica

7978 silver badges14 bronze badges

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

Comments

Roman Skydan · Accepted Answer · 2016-06-16 14:15:17Z

0

try this

  <select class="form-control" id="pricetags" ng-model="products.selectedPriceTag">
    <option ng-repeat="product in products.priceTag" value="{{product.priceTagId}}">{{product.pModel}}</option>
  </select>

answered Jun 16, 2016 at 14:15

Roman Skydan

5,7664 gold badges22 silver badges40 bronze badges

Comments

hughesjmh · Accepted Answer · 2016-06-17 10:45:23Z

0

You're using the ng-options syntax for arrays, but you're trying to select from $scope.products, an object. Modify your code so it iterates through the priceTag array in the $scope.products object..

<select class="form-control" id="pricetags" ng-model="selectedPriceTag" 
ng-options="priceTag.pModel for priceTag in products.priceTag" > 
</select>

Not sure if that's what you're looking for, but it should work!

edited Jun 17, 2016 at 10:45

answered Jun 16, 2016 at 14:15

hughesjmh

2,2532 gold badges13 silver badges11 bronze badges

Collectives™ on Stack Overflow

How to populate data in drop down using angularjs?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related