如何使用角度 js 将选择下拉列表中的值填充为默认值
How to populate value in a select dropdown as default using angular js
<select data-ng-model="userInf.role" class="span12" required>
<option value="" selected="selected" disabled="disabled">Choose one</option>
<option data-ng-repeat="role in roles" value="{{ role.text }}">{{ role.text }}</option>
</select>
角
userService.getUser($scope.userInf,
function( data ) // success
{
$scope.userInf = {
username: data.userName,
firstname: data.firstName,
middlename: data.middleName,
lastname: data.lastName,
title: data.title,
organization: data.organization,
role: data.authorization.role,
dateOfBirth:data.dateOfBirth,
save: 'update'
};
},
其他文件即将到来,但选择值未到来
在检查元素中我可以看到
<select data-ng-model="userInf.role" class="span12 ng-pristine ng-valid ng-valid-required" required="">
<option value="? string:Analyst ?"></option>
<option value="" selected="selected" disabled="disabled">Choose one</option>
<!-- ngRepeat: role in roles --><option data-ng-repeat="role in roles" value="Analyst" class="ng-scope ng-binding">Analyst</option>
<option data-ng-repeat="role in roles" value="Admin" class="ng-scope ng-binding">Admin</option>
</select>
我知道Angular有ng-init指令来实现这个目的。 你为什么不试试ng-options指令? 您可以将 ng-init 指令与 ng-options 并排使用,ng-options 比 ng-repeat 更灵活一些。
<select ng-model="userInf.role" ng-options="role for role in roles" ng-init="userInf.role = '' " class="span12 ng-pristine ng-valid ng-valid-required" required="">
<option value="" disabled="disabled">Choose one</option>
</select>
ng-init 会将您的 ng-model(即下面定义的选项的值(设置为您想要的任何值,在这种情况下,将您的 ng-model 设置为 '',这是您的第一个选项的值。 ng-options 将使用数组中的值填充其余选项。 您可能需要一些设置才能在选项中显示正确的名称和值。 看这里 https://docs.angularjs.org/api/ng/directive/select
是的,我会这样做:
var app = angular.module('app', [])
app.controller('exampleCtrl', function ($scope) {
$scope.options = ["a", "b", "c"]
$scope.selected = $scope.options[1]
})
<select ng-options="o for o in options" ng-model="selected"></select>
选项"b"将在加载时选择
<select name="repeatSelect" id="repeatSelect" ng-model="data.repeatSelect">
<option ng-repeat="option in data.availableOptions" value="{{option.id}}">{{option.name}}</option>
</select>
相关文章:
- 我的shareService在angular 2中发送值工作正常,但当我渲染我的另一个组件时,会获得默认值
- jquerydatetimepicker日期和时间应在框默认值中,而无需单击框
- 如果值为空,如何设置输入的默认值?jQuery
- 骨干模型默认值-todos.js示例中不必要的代码
- jquery日期选择器年份范围默认值
- Html5输入属性的默认值,如最小值、最大值、大小等
- 根据两个下拉列表的默认值禁用按钮
- 如何创建具有默认值的JavaScript对象字段?(AngularJS模型相关)
- Angularjs-设置不带ng选项的select的默认值
- 用默认值填充数组的方法
- 如何使用 Ext-JS 中的默认值填充 ItemSeclector 中的“选定”列
- 为已由数据库信息填充的下拉列表设置默认值.MVC 4.
- 在此脚本中填充默认值的位置
- 如何使用角度 js 将选择下拉列表中的值填充为默认值
- 如何使用默认值填充文本字段或将其保留为空,所有这些都取决于下拉列表中的选择
- JavaScript在模糊时将默认值填充回文本字段
- 在使用Ajax填充下拉框时设置默认值
- 如何定义HTML表单元素的默认值而不填充字段
- 使用默认值填充多维javascript数组矩阵
- jQuery用默认值填充空文本输入