Выберите значение элемента, которое не отправляется с другими элементами формы в Angular

Question

Я использую Angular для отправки содержимого формы в конечную точку API. Все работало нормально, пока я не попытался изменить одно из полей ввода текста на раскрывающийся список. Я использую ng-options для заполнения раскрывающегося списка, но когда я отправляюсь на отправку содержимого формы в конечную точку API, значение элемента select не отправляется. Ниже приведен HTML (с информацией о классе и стили, удаленной для краткости) и Angular.

HTML

<form ng-submit="self.addNewEmployee()" novalidate> 
    <input ng-model="self.form.employeeName" type="text"> 
    <select ng-model="self.form.department" ng-options="dept.name as dept.Name for dept in self.departmentList"> 
    </select> 
    <input ng-model="self.form.salary" type="text" /> 
    <input id="btnSubmit" type="submit" value="Add Employee" /> 
</form> 

Угловое

<script type="text/javascript"> 
    var adminToolApp = angular.module('adminToolApp', []); 

    adminToolApp .controller('AdminToolController', function ($scope, $http) { 
     var self = this; 
     self.departmentList = []; 

     // Gets all departments to populate select input 
     $http({ 
      method: 'GET', 
      url: 'https://api.myServer.net/api/getAllDepartments', 
      headers : { 
       'Content-Type': 'application/json', 
      } 
     }).then(function(result) { 
      self.departmentList = result.data; 
     }, function (error) { 
      console.log(error); 
     }); 

     // Submits form data to add new employee 
     self.addNewEmployee = function() { 
      return $http({ 
       method: 'POST', 
       url: 'https://api.myServer.net/api/addNewEmployee', 
       data: angular.toJson(self.form), 
       headers: { 
        'Content-Type': 'application/json', 
       } 
      }).then(_submissionSuccess, _submissionFailure); 
     }; 

     // Private methods 

     function _submissionSuccess(response) { 
      self.submissionResults = response.data; 
     }; 

     function _submissionFailure(response) { 
      self.submissionResults = 'An error occured: ' + response.status; 
     }; 
    }); 
    </script> 

Когда я осмотреть полезный груз отправляется на API из двух элементов формы присутствуют (employeeName и salary), однако отдел нет. Я определил self.form.department как ng-model для элемента select, почему он не представлен как часть коллекции форм?

Answer 1

Попробуйте изменить

ng-options="dept.Name as dept.Name for dept in self.departmentList">