我正在嘗試在 Angular JS 的下拉串列中設定默認值。下面是我的代碼:
<div class="dropdownIcon">
<select name="actions" id="actions"
ng-options="option.Value for option in Data.Actions"
ng-focus="ActionsLabel = true" ng-blur="ActionsLabel = false;"
ng-model="Data.EmployeeStatusChangeRoutingInput.Action"
/>
<label for="actions" class="labelColor"
ng-class="{'dropdownLabelFloat' : (ActionsLabel || Data.EmployeeStatusChangeRoutingInput.Action != null), 'dropdownLabel' : !ActionsLabel && !Data.EmployeeStatusChangeRoutingInput.Action }">
Action
</label>
</div>
我想將默認值設定為“---”并且 Id=0。在我的控制器中,我有以下代碼:
var inputValues = angular.copy($scope.Data.EmployeeStatusChangeRoutingInput);
$scope.Data.EmployeeStatusChangeSaveInSession = {
EffectiveDateString: inputValues.EffectiveDate.toString(),
Action: inputValues.Action.Value,
};
我試圖將此代碼放在我的控制器中,以便將默認值設為 0:
$scope.Data.Action = 0;
我在控制器中的這一行之后寫了上面的行:
var inputValues = angular.copy($scope.Data.EmployeeStatusChangeRoutingInput);
通過放置此行,下拉串列的選定值不會更改為'---'。
如果用戶未在下拉串列中選擇任何值,則應預先選擇“---”。如果用戶確實選擇了某個值,那么這些值應該傳遞給控制器??。
任何幫助將不勝感激。
uj5u.com熱心網友回復:
為了預設值,您必須給出ng-model一個實際值。在這里我添加了
EmployeeStatusChangeRoutingInput: {
Action: 'value3'
}
但是,您還需要ng-options使用以下語法形成您的名稱/值對:
ng-options="option.Name as option.Value for option in Data.Actions"
angular.module('myApp', [])
.controller('myCtrl', ['$scope', function($scope) {
$scope.Data = {
Actions: [{
Value: 'test1',
Name: 'value1'
}, {
Value: 'test2',
Name: 'value2'
}, {
Value: 'test3',
Name: 'value3'
}],
EmployeeStatusChangeRoutingInput: {
Action: 'value3'
}
}
}])
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div class="dropdownIcon">
<select name="actions" id="actions" ng-options="option.Name as option.Value for option in Data.Actions" ng-focus="ActionsLabel = true" ng-blur="ActionsLabel = false;" ng-model="Data.EmployeeStatusChangeRoutingInput.Action"></select>
</div>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/464219.html
標籤:angularjs
