角度JS多选选项添加额外的?选择
Angular JS Multiple Select Options adding extra ? Option
我像这样填充我的多重选择:
<select ng-model="myAddress" ng-options="address.addressLines for address in search.result.addresses" >
</select>
目前有 2 个项目。但是当我加载页面时,它似乎添加了一个额外的空白行
<option value="?" selected="selected" label=""></option>
但是当我单击实际的 2 个项目行时,上面的错误行消失了。知道是什么原因造成的吗?
当选择最初加载到视图中时,不会从控制器设置模型 (myAddress)。Angular 需要一种方法来表示这一点,因此它会在选择框中添加一个空选项。进行选择后,将填充该选项并删除空选项,因为它未在绑定到所选内容的列表中定义。
如果不希望显示空白选项,则需要在控制器中设置有效的 $scope.myAddress 作为默认值。
根据您想要完成的任务,实际上有三种选择。
- 您可以保持它现在的工作方式,在进行选择之前有一个空选项可用。
- 在控制器中设置初始值,以便没有可用的空选项。
- 始终有一个空选项可用,即使已将值设置为选择也是如此。
这里的例子:
.HTML:
<div ng-app="myApp" ng-controller="MainController">
Select with no value set in controller:<br />
<select ng-model="select1" ng-options="item.name for item in items">
</select> {{select1}}
<br /><br />
Select with value set in controller:<br />
<select ng-model="select2" ng-options="item.name for item in items">
</select> {{select2}}
<br /><br />
Select empty option always available (even after selection):<br />
<select ng-model="select3" ng-options="item.name for item in items">
<option value=""></option>
</select> {{select3}}
</div>
Javascript:
angular.module("myApp", [])
.controller("MainController", function ($scope) {
$scope.items = [
{id: 1, name: "Item 1"},
{id: 2, name: "Item 2"},
{id: 3, name: "Item 3"},
{id: 4, name: "Item 4"}
];
//initial value for select2
$scope.select2 = $scope.items[0];
});
相关文章:
- 将用户选择添加到数组中
- JQuery未选择添加的元素
- 根据用户的下拉选择添加表单字段
- 向选择添加标签
- 尝试在鼠标悬停时为Wordpress中的下拉菜单选择添加突出显示
- 选择 2 添加其他参数以选择选项
- Jquery 可以选择添加回调
- 如何在不按 DOM 顺序排序的情况下将 jquery 选择添加到一起
- 使用 jQuery.find 选择添加的图像进行 css 操作不起作用
- 角度选择添加未定义的选项
- 引导-选择添加项目并选择它
- 根据表单选择添加表单字段
- 在单选按钮选择上显示表,然后将单选按钮值传递给表中的字段,选择添加更多,然后附加到现有表
- 不能选择添加的元素
- 我需要创建一个多选项选择页面,其中每个选择添加或减去产品的价格
- 可以't选择添加的jQuery
- Jquery复选框上的选择添加一个名称属性和增量在多个选择
- 选择添加任何自定义值的框
- 如何从用户接收到的输入中为html选择添加一个选项
- 当选择添加时,使购物车数量计数器显示添加的产品