Switching between modes / Accessing parts of data structure

Question

Given the following data:

    {
        id:         "",
        title:      "",
        // modes
        one: {
            stage:  1,
            order:  3,
            more:   "", 
        }       
        two: {
            stage:  14,
            order:  5,
            more:   "", 
        }       
        // ...
    },
    // ...

how can I combine the following two pieces of code into one that uses a variable as a switching mechanism for the mode?

// If selected mode was "one"
<li ng-repeat="item in items | orderBy: ['one.stage', 'one.order'] 
| filter: oneFilter" ng-class="{ topline: isNewOneStage( item )}">
    {{ item.title }}, 
    {{ item.one.stage }}
    // ...
</li>

// If selected mode was "two"
<li ng-repeat="item in items | orderBy: ['two.stage', 'two.order'] 
| filter: twoFilter" ng-class="{ topline: isNewTwoStage( item )}">
    {{ item.title }}, 
    {{ item.two.stage }}
    // ...
</li>

Since the two pieces of code are completely identical - apart from the mode - I would like to avoid code duplication. (Note also that there will eventually be more than just two modes.)

Answer 1

I agree with Michael that you should probably reorganize your code, but if you must have it all at once you can do this depending on what version of angular you are using:

// variable mode is either 'one' or 'two'
<li ng-repeat="item in items | orderBy: [ mode + '.stage', mode + '.order'] 
| filter: (mode == 'one' ? oneFilter: twoFilter)" ng-class="{ topline: (mode == 'one' ? isNewOneStage: isNewTwoStage)( item )}">
    {{ item.title }}, 
    {{ item[mode].stage }}
    // ...
</li>