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);
    }
};

 

更多专业前端知识，请上【猿2048】www.mk2048.com