AngularJS 1.5.x

    var app = angular.module('plunker', []);
    
    app.controller('MainCtrl', function($scope) {
      var vm = this;
      vm.newStudent= {ethnicity:''};
      
      var regNewStudent = { 
              ethnic: ''
          };
      
      vm.listofEthnicity = [ 
        { "code": 111, "name": "New Zealand European/Pākehā" }, 
        { "code": 121, "name": "British / Irish" }, 
        { "code": 122, "name": "Dutch" }, 
        { "code": 123, "name": "Greek" }
        ];
      
        vm.save = function() {
          regNewStudent = { 
              ethnic: vm.newStudent.ethnicity,
          };
            // cause i dont have the postToApi to factory i just console it.
            console.log(regNewStudent);
            if(Array.isArray(regNewStudent.ethnic)){
              console.log('is array');
            }else{
              console.log('not array');
            }
            //postToApi.push(regNewStudent); //uncomment on your code.
        };
      
    });

    <!DOCTYPE html>
    <html ng-app="plunker">
    
      <head>
        <meta charset="utf-8" />
        <title>AngularJS Plunker</title>
        <script>document.write('<base href="' + document.location + '" />');</script>
        <link rel="stylesheet" href="style.css" />
        <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
        <script src="app.js"></script>
      </head>
    
      <body ng-controller="MainCtrl as vm">
       
        <select ng-model="vm.newStudent.ethnicity" placeholder="Ethnicity" aria-label="Ethnicity" ng-model-options="{trackBy: '$value.code'}" multiple ng-options="opt as opt.name for opt in vm.listofEthnicity">
        </select>
        
    {{vm.newStudent.ethnicity}}
    
    <button ng-click="vm.save()">Save</button>
      </body>
    
    </html>

/* Put your css in here */