zoukankan      html  css  js  c++  java
  • angularjs ng-select ng-options 默认选中项.

    <!DOCTYPE html>
    <html ng-app="myApp">
        <head>
            <meta charset="utf-8" />
            <title></title>
        </head>
        <body>
            <div ng-controller="CityController">
                <select ng-model="city" value="city.id" ng-options="city.name for city in cities" >
                    <option value="">Choose City</option>
                </select>
                <span ng-bind-template="Best City:{{city.name}},id:>>{{city.id}}">
                </span>
            </div>
        </body>
        <script type="text/javascript" src="js/angularJs-1.2.16-min.js" ></script>
        <script type="text/javascript">
            angular.module("myApp",[])
            .controller("CityController",function($scope){
                
                $scope.cities=[
                    {name:"合肥",id:2},
                    {name:"北京",id:3},
                    {name:"上海",id:4},
                    {name:"舒城",id:5},
                    {name:"纽约",id:6},
                    {name:"络上几",id:7}
                ];
                
                for(var i in $scope.cities){
                    if($scope.cities[i].id==4){//将d是4的城市设为选中项.
                        $scope.city=$scope.cities[i];
                        break;
                    }
                }
            });
            
            
        </script>
    </html>

    注意:

    1.这里的的value不是我们给的值.而是循环的索引.

    2.ng-model绑定我们的选中项.

    3.默认选中项要在controler中指定,并且要和ng-model关联.

  • 相关阅读:
    Flask商城项目详解
    《剑指offer》题解(Python版本)
    小程序学习笔记
    Html5 语义化标签
    常用页面布局
    css 语法记录
    vue-router 配置
    axios 配置
    Mybatis Generator
    openssl_pkcs7_verify的问题之旅
  • 原文地址:https://www.cnblogs.com/guoyansi19900907/p/5178517.html
Copyright © 2011-2022 走看看