angular js Select标签中的ng-options用法

最新推荐文章于 2024-09-07 09:07:45 发布

Inovation_Sky

最新推荐文章于 2024-09-07 09:07:45 发布

阅读量3.3k

点赞数 1

分类专栏： angular js

本文链接：https://blog.csdn.net/Melody_Susan/article/details/53537520

版权

angular js 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

Select标签绑定option一直很麻烦,有了angular js的 ng-options只需定义好json对象轻松绑定option,

ng-options 指令用于使用 <options> 填充 <select> 元素的选项。

ng-options 指令使用数组来填充下拉列表，多数情况下与 ng-repeat 指令一起使用。

json变量定义:

 $scope.goods_level = [{
                    id: 0,
                    name: "普通"
                }, {
                    id: 1,
                    name: "精品"
                }, {
                    id: 2,
                    name: "极品"
                }, {
                    id: 3,
                    name: "差"
                }];

html angular js绑定

                <td class="td">
                    <select ng-model="mallGoods.level" ng-options="a.id as a.name for a in goods_level" >
                    </select>
                    <input type="hidden" name="level"  value="{{mallGoods.level}}">
                </td>

as a.name的意思option显示名称, a.id意思是option的value。 a为单个JSON对象。