angular Select选择框

最新推荐文章于 2019-12-18 10:55:57 发布

weixin_33958585

最新推荐文章于 2019-12-18 10:55:57 发布

阅读量256

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/shuaihong/blog/1540618

版权

2019独角兽企业重金招聘Python工程师标准>>>

ng-options 生成select下拉列表需要配合ng-model指令使用否则报错

    ```html
    <body ng-app="myApp" ng-controller="demoCtrl">

        <!--
            ng-options ：生成下拉框列表 需要和ng-model指令配合使用

            ball in balls 类似于ng-repeat

                balls 是要进行循环的数据

                in 固定写法

                ball 是每次循环的当前项

            ball.name for

                for 固定写法

                ball.name 将要显示在option标签内的值

            ball.value as

                as 固定写法

                ball.value 将要显示在option标签value属性中的值

        -->

        <select ng-model="likeBall" ng-options="item.value as item.name for item in balls"></select>

        {{likeBall}}

        <script src="node_modules/angular/angular.min.js"></script>
        <script>
            angular.module('myApp',[])
                .controller('demoCtrl',['$scope',function($scope){

                    // 给下拉列表设置默认值 和options标签value属性的值对应
                    $scope.likeBall = "001";

                    // 下拉列表的数据源
                    $scope.balls = [
                        {
                            name:'足球',
                            value:'001'
                        },
                        {
                            name:'篮球',
                            value:'002'
                        },
                        {
                            name:'橄榄球',
                            value:'003'
                        },
                        {
                            name:'排球',
                            value:'004'
                        },
                        {
                            name:'乒乓球',
                            value:'005'
                        }
                    ];

                }])
        </script>
    </body>

转载于:https://my.oschina.net/shuaihong/blog/1540618