change scope in angular ng-options

Question

New to angular,

i have this:

<div ng-controller="Ctrl">     
Sort by:
<select ng-model="voterList" ng-options="voter as voter.name for voter in voter.availableOptions">           
</select>
<p>Ordered by: {{voterList.name}}</p>

and

    var app = angular.module('app', []);

function Ctrl($scope) {
  $scope.voter = {
   availableOptions: [
       {id: '1', name: 'Option A'},
       {id: '2', name: 'Option B'},
       {id: '3', name: 'Option C'}
     ],

     }; 
}

I need the $scope to change to $scope.voter.DoNotContactBefore instead of just $scope.voter but that seems to mess with the ng-options. I don't know what I would need to change.

Help much appreciated, thanks!

Answer 1

Not sure I understand your question correctly, but I sense you only need to rewrite:

$scope.voter = {
   availableOptions: [
       {id: '1', name: 'Option A'},
       {id: '2', name: 'Option B'},
       {id: '3', name: 'Option C'}
     ],

     }; 

to:

$scope.voter = {
   DoNotContactBefore: {
     availableOptions: [
       {id: '1', name: 'Option A'},
       {id: '2', name: 'Option B'},
       {id: '3', name: 'Option C'}
     ]
   }
}; 

and then just change "ng-options" to ng-options="voter as voter.name for voter in voter.DoNotContactBefore.availableOptions"