添加選項以自動選擇
[英]adding option to select gets automatically selected
問題描述
我有一個使用ng-options的下拉列表（角）。 我選擇了一個默認選項，值為空。 （因此它具有“ selected”屬性和與模型相同的值）
每當我向ng-options中添加另一個不為空的元素時，如果模型具有空值（指向默認的空選項），則會自動選擇新添加的選項。 模型的值仍然為空，但是下拉列表現在會自動顯示新添加的選項。 我還嘗試將默認選項設置為“”，而不僅僅是“”，但它仍進行相同的更改。
有什么方法可以保證不會自動選擇新添加的選項？
`<select class="form-control section" ng-model="action.prop">
<option value="" disabled selected>Select Property</option>
<option ng-repeat="prop in tr.props| orderBy:prop.name"
value="{{prop.name}}"> {{prop.name}} </option>
</select>`
3 個解決方案
解決方案1
1 2018-04-04 07:39:38
嘗試這個 ：）
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectedName" ng-options="x for x in names">
</select>
<p>{{selectedName}}</p>
<button ng-click="add()">add</button>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.names = [""];
$scope.selectedName = $scope.names[0]
$scope.add = function() {
$scope.names.push("new");
}
});
</script>
</body>
</html>
解決方案2
1 2018-04-04 09:10:44
您只需在運行get下拉功能之前將控制器中的ng-model設置為以下內容即可。 這樣，它將始終設置為默認值。
控制者
$scope.action = {};
$scope.action.prop = '';
解決方案3
0 已采納 2018-04-04 11:23:45
即使Roth的解決方案在我的情況下效果很好。 如果我使用ng-options和過濾器，那么Nishant也會。
我決定在ng-repeat上設置一個ng-if =“ prop.name！=''”。 由於發生在我身上的是大約一秒鍾的時間，因此ng-repeat將會擁有最新的prop，其空名稱為一秒鍾，並且當ng-model =“”時，它會將該選項設置為選中狀態。
<select class="form-control section" ng-model="action.prop">
<option value="" disabled selected>Select Property</option>
<option ng-if="prop.name != ''" ng-repeat="prop in tr.props| orderBy:prop.name"
value="{{prop.name}}"> {{prop.name}} </option>
</select>
不應自動選擇第一個選擇選項
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.