How to reorder based on another array in Angular JS

Question

Please check this Fiddle: http://jsfiddle.net/houmaka/vHXy4/

When user fills different fields ng-repeat order the output. How can I enforce a custom ordering based on my fields array? (There are more than 20 fields in the form, I just put a snapshot of the actual form.)

a quick glance:

$scope.fields = [];
$scope.fields = {
    contact_person: 'Contact Person',
    app_owner_name: 'Name of Application Owner',
    app_owner_phone_number: 'Application Owner Phone Number',
}

And to show them:

  <div>
    <div ng-repeat="(key, value) in user">
        <div ng-show="value">
            <div>{{fields[key]}}:</div>
            <div>{{value}}</div>
        </div>
    </div>
   </div>

Thanks

d453 · Accepted Answer · 2014-05-28 12:57:56Z

1

I would suggest this fields model:

$scope.fields = [
    { index: 3, name: 'Contact Person', id: 'contact_person' },
    { index: 2, name: 'Name of Application Owner', id: 'app_owner_name' },
    { index: 1, name: 'Application Owner Phone Number', id: 'app_owner_phone_number' },
];

And this ngRepeat usage:

    <div ng-repeat="field in fields | orderBy: 'index' ">
        <div ng-show="user[field.id]">
            <div>{{field.name}}</div>
            <div>{{user[field.id]}}</div>
        </div>
    </div>

answered May 28, 2014 at 12:57

d453

5296 silver badges10 bronze badges

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

1 Comment

Mr H Over a year ago

Thanks mate. When I changed the index, all good and works as expected. Cheers

Collectives™ on Stack Overflow

How to reorder based on another array in Angular JS

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related