Восстановление значения выпадающего значения по умолчанию с помощью angularjs

Question

Хотя у меня это работает, способ его работы кажется неправильным. У меня есть раскрывающийся список (DDL), который отображает список команд. Верхняя и стандартная запись - «Выбрать команду ...». Хотя мой DDL привязан к модели, «Select Team ...» не должен быть частью этого, поскольку «Select Team ...» не имеет смысла для модели домена.

Когда пользователь нажимает кнопку «Добавить новое», форма очищается, и все DDL должны возвращаться к значениям по умолчанию.

Вот соответствующие функции контроллера:

scope.addUser = function() { 
    resetToNewUser(); 
    $scope.profileVisible = true; 
    $scope.oneAtATime = true; 
    $scope.accordionStatus = { isFirstOpen: true, isFirstDisabled: false }; 
} 

function resetToNewUser() { 
    $scope.selectedUser.NtId = ""; 
    $scope.selectedUser.UserId = -1; 
    $scope.selectedUser.IsActive = true; 
    $scope.selectedUser.FirstName = ""; 
    $scope.selectedUser.LastName = ""; 
    $scope.selectedUser.JobTitle = ""; 
    $scope.selectedUser.Email = ""; 
    $scope.selectedUser.SecondaryEmail = ""; 
    $scope.selectedUser.PhoneNumber = ""; 
    for(var i = 0; i < $scope.roleList.length; i++) { 
    if($scope.roleList[i].RoleSystemName.trim() === "BLU") { 
     $scope.selectedUser.Role = $scope.roleList[i]; 
    } 
    } 
    $scope.selectedUser.SupervisorId = null; 
    //HACK BELOW// 
    document.getElementById('selTeam').selectedIndex = 0; // <-- This works, but feels like a hack. 
    $scope.selectedUser.IsRep = false; 
    for(var i = 0; i < $scope.signingAuthorityList.length; i++) { 
    if($scope.signingAuthorityList[i].SigningAuthoritySystemName === "SME") { 
     $scope.selectedUser.SigningAuthority = $scope.signingAuthorityList[i]; 
    } 
    } 
    $scope.selectedUser.IsOutOfOfficeEnabled = false; 
    $scope.selectedUser.OutOfOfficeStartDate = null; 
    $scope.selectedUser.OutOfOfficeEndDate = null; 
    $scope.selectedUser.OutOfOfficeAppointedRepId = null; 
} 

Вот как DDL определяется в шаблоне:

<div class="form-group"> 
    <label for="" class="control-label col-sm-2 required">Team</label> 
    <div class="col-sm-10"> 
    <select class="form-control" id="selTeam" 
      ng-model="selectedUser.Team" 
      ng-options="team as team.TeamName for team in teamList track by team.TeamId"> 
     <option value="">Select Team...</option> 
    </select> 
    </div> 
</div> 

Есть ли лучший способ сделать это?

Answer 1

Вы всегда можете просто удалить возможность выбора пользователем опции-заполнителя, не так ли? Что-то вроде этого:

<option value="" disabled selected hidden>Select Team...</option> 

Answer 2

Вы html-часть выглядит хорошо, но я думаю, что на стороне js вы делаете много логики. Что произойдет, если на сервере будут добавлены новые параметры? Лучше получить состояние нового пользователя из бэкэнд, настроить его с помощью избранных и других виджетов и сохранить его до того, как он будет отправлен. На псевдокоде это будет выглядит как

$scope.addUser = function() { 
    //create empty user on the scope 
    $scope.selectedUser = {}; 
    //get the new user state from the backend 
    UserService.resetToNewUser($scope.selectedUser); 
    //setup view options 
    $scope.accordionStatus = {isFirstOpen: true, isFirstDisabled: false} 
}; 

app.service('UserService', function(){ 
    this.resetToNewUser = function(user){ 
     $http({ 
      method: 'GET', 
      url: '/default_user/' 
     }).then(function successCallback(response) { 
      user = response; 
     ); 
    };   
});