用angularjs恢复默认的下拉值

虽然我已经有了这个工作，但它的工作方式似乎不合适。我有一个显示团队列表的下拉列表（DDL）。顶部和默认条目是“选择团队...”。尽管我的DDL与模型绑定，但“Select Team ...”不应该成为它的一部分，因为“Select Team ...”对域模型没有意义。用angularjs恢复默认的下拉值

当用户单击“添加新”时，表单将清除，所有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>

有没有更好的方式来做到这一点？

来源

2015-12-15 Legion

我想指出，尽管看起来像一个“黑客”相比，它周围的东西，你也不会找到一个更快/更清洁的方式（除非可能已经拥有手头选择的原生js对象，但ById很快，而不是太多）。我会建议将这个魔术字符串移动到某个地方，以方便更改，或者从库中动态传递（应该知道），但纯粹的angularjs解决方案可能不是我可以帮到的。 G'luck！ – abluejelly

您可以随时删除用户选择占位符选项的权限，对吗？这样的事情：

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

来源

2015-12-15 18:49:34

你的html部分看起来不错，但我认为在js方面你做了很多逻辑。如果在服务器上添加新选项会发生什么情况？最好从后端获取新用户的状态，使用select和其他小部件对其进行自定义，并在提交之前将其保留。在伪代码它看起来像

$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; 
     ); 
    };   
});

来源

2015-12-15 18:55:04 theodor

用angularjs恢复默认的下拉值

回答

相关问题