CODEWITHSUNDEEP
javascripthtmlangularjs
Vibhor
Vibhor

Reputation: 115

My ng-repeat is working only alphabetically |angularJS

I am trying to implement an app where there can be infinite number of products in an object The JSON

 $scope.tableContent = [
        {
            id: 1,
            sks: 'sk1',
            product1: [],
            product2: []
        },
        {
            id: 2,
            sks: 'sk2',
            product1: [],
            product2: []
        },
        {
            id: 3,
            sks: 'sk3',
            product1: [],
            product2: []
        }];

Here a product3 is directly added when I click on a button in HTML , however after the product9 the product10 appers in next block to product1 , which i later found out is becuase the products are being displayed in alphabetical order

My HTML 

   </div>
    <!-- in this division the values are the ones to be shown -->

    <div class="row" id="{{x.id}}" ng-repeat="x in tableContent">

        <div class="cell" ng-click=openModal(x)> {{x.sks}} </div>

        <div class="cellD" ng-repeat="(key, value) in x" ng-if="key !== 'id' && key !=='sks' ">
            {{key}}    {{ value }}
            <div class=row ng-repeat=" prod in value">

                <div class=cell>{{prod}}

                </div>

            </div>
            <div class=row>
                <div class="cell" ng-click="modalBoxOpen(key,x.id)">+</div>
            </div></div>

also if the values like ProductA or productB are given they , despite being whatever order in the JSON are displayed in alphabetical order

Upvotes: 0

Views: 86

Answers (2)

Majid Parvin
Majid Parvin

Reputation: 5062

It's obvious. because product10 < product9.

if you wanna order your products based on this kind of sequence you must consider this. for example you can use product09 instead of product9 or handle it manually use compare function. or you can take another field using for order like id.

Upvotes: 1

rrd
rrd

Reputation: 5967

Use the orderBy: 

<div class="row" id="{{x.id}}" ng-repeat="x in tableContent | orderBy: 'id'">

Upvotes: 0

Related Questions