• angular raido checkbox select取值


    radio

     {{modelName}}
    <div class="radio disIB">
        <label class="i-checks">
            <input type="radio" name="name" ng-model="modelName" value="1"> //因为单选 ng-model为同一个值,value是选中时候获取到的值
            <i></i>
            11
        </label>
    </div>
    
    <div class="radio disIB">
        <label class="i-checks">
            <input type="radio" name="name" ng-model="modelName" value="2">
            <i></i>
            22
        </label>
    </div>

    checkbox

    <div class="col-md 12">
    {{ckone}} ,{{cktwo}}
    <div class="checkbox checkbox-primary m-t-0">
    <label>
    <input type="checkbox" ng-model="ckone" ng-checked="1" ng-true-value="1" ng-false-value=""> //多选时 model名不同 ng-checked:值为x的时候被选中 ng-true-value:选中的时候值 ng-false-value:取消选择的值
    <span class="cr"><i class="cr-icon fa fa-check"></i></span>
    </label>
    </div>//如果在js里把这个值默认选中 则 $scope.ckone = 1
    <div class="checkbox checkbox-primary m-t-0">
    <label>
    <input type="checkbox" ng-model="cktwo" ng-true-value="3" ng-false-value="4">
    <span class="cr"><i class="cr-icon fa fa-check"></i></span>
    </label>
    </div>
    </div>

     select

    {{selectData}}
    <select ng-model="selectData">
        <option ng-repeat="item in dataList" ng-click="selectData = item.value">{{item.name}}</option>
    </select>

    ng-repeat checkbox 取值和默认勾选

    接口请求回来的json:

    "certTypeRange": [
    {"value": "1",
    "name": "身份证"
    },
    {"value": "2",
    "name": "护照"
    },
    {"value": "3",
    "name": "军官证"
    },
    {"value": "4",
    "name": "港澳通行证"
    },
    {"value": "5",
    "name": "驾照"
    },
    {"value": "6",
    "name": "台胞证"
    },
    {"value": "7",
    "name": "出生证"
    },
    {"value": "8",
    "name": "其它(个人)"
    },
    {"value": "30",
    "name": "社会统一信用证"
    },
    {"value": "31",
    "name": "营业执照"
    },
    {"value": "32",
    "name": "其它(公司)"
    }
    ],

    html

    <!--{{insuredCerTypeRange}}-->
    <div class="checkbox checkbox-primary m-t-0 disIB mr10" ng-repeat="item in selectDataList.certTypeRange">
        <label>
            <input  type="checkbox"
                    name="certTypeRange[]"
                    value="{{item.value}}"
                    ng-checked="insuredCerTypeRange.indexOf(item.value) > -1"
                    ng-click="toggleSelection_insuredCerTypeRange(item.value)">
            <span class="cr"><i class="cr-icon fa fa-check"></i></span>
            {{item.name}}
        </label>
    </div>

    js

     // 被保险人证件类型
    $scope.insuredCerTypeRange = ['1','2'];  //默认勾选值为1,2的checkbox
    $scope.toggleSelection_insuredCerTypeRange = function funName(item) {
        var idx = $scope.insuredCerTypeRange.indexOf(item);
        if (idx > -1) {
            $scope.insuredCerTypeRange.splice(idx, 1);
        }
        else {
            $scope.insuredCerTypeRange.push(item);
        }
    };
  • 相关阅读:
    php.h: No such file or directory
    检查日期是否为节假日api
    Linux下实现秒级的crontab定时任务
    Apache 两种mpm prefork 和 worker 的区别
    centos6 安装mysql报错Requires: libc.so.6(GLIBC_2.14)
    Yii2 高级模板添加更多Application
    Yii2 assets注册的css样式文件没有加载
    Yii rbac原理和实践
    Yii2 ActiveRecord save失败
    Yii2 手动安装yii2-imagine插件
  • 原文地址:https://www.cnblogs.com/cynthia-wuqian/p/7094423.html
Copyright © 2020-2023  润新知