zoukankan      html  css  js  c++  java
  • ng-selected 与ng-options的使用

    1:ng-selected用在<option>标签上面,ng-options用在<select>上面,用于动态创建options列表。

    <form class="uk-form" ng-controller="TestCtrl">
                <select ng-model="sex">
                    <option value="m" ng-selected="sex=='m'">Male</option>
                    <option value="f" ng-selected="sex=='f'">Fmale</option>
                </select>
                
                <p>Selected City Code: {{ city.code }}</p>
                <select ng-model="city" ng-options="city.name for city in cities"></select>
            </form>

    2:city.name作为用户选择时看到的值,用户选择的时city对象,通过city.code获取其对应的代码。

    <select ng-model="city" ng-options="city.name for city in cities"></select>

    3:index.js

    var myApp = angular.module('myApp', []);
    
    myApp.controller('TestCtrl',['$scope', function($scope){
            $scope.sex = 'm';
            
            $scope.cities = [
                {
                    name:'青岛',
                    code:'qd'
                },
                {
                    name:'北京',
                    code:'bj'
                },
                {
                    name:'济南',
                    code:'jn'
                }
            ];
    }]);
  • 相关阅读:
    Alpha冲刺Day10
    Alpha冲刺Day9
    Alpha冲刺Day8
    Alpha冲刺Day7
    Alpha冲刺Day6
    SDN
    【Alpha
    【Alpha】团队课程展示
    【Alpha】团队项目测试报告与用户反馈
    【Alpha】总结
  • 原文地址:https://www.cnblogs.com/yshyee/p/4273828.html
Copyright © 2011-2022 走看看