javascript - Angular遍历Radio选项,如何设置某个选项为默认选中状态?
本文介绍了javascript - Angular遍历Radio选项,如何设置某个选项为默认选中状态?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
talking ischeap,show me the code(不要逼逼,直接看代码)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Angular Radio测试</title>
<script src="//cdn.bootcss.com/angular.js/1.6.2/angular.js"></script>
</head>
<body ng-app="testApp">
<div class="form-group" ng-controller="testCtr">
<label class="col-lg-3 col-sm-3 control-label">机构名称 :</label>
<div class="col-lg-9">
<div class="form-group" ng-repeat="item in orgTypes">
<label><input type="radio" name="orgType" ng-model="viewModel.orgType" ng-value="item">{{item}}</label>
</div>
<input value="{{viewModel.orgType}}" type="text" placeholder="你选中的类型是"/>
</div>
</div>
<script type="text/javascript">
var testObj = angular.module('testApp',[]);
testObj.controller("testCtr",function($scope){
$scope.orgTypes = ['其他','医院','养老院'];
$scope.viewModel = {};
});
</script>
</body>
</html>
运行效果
感谢@crazy4x 的评论,JS代码改成下面这样就可以了!
<script type="text/javascript">
var testObj = angular.module('testApp',[]);
testObj.controller("testCtr",function($scope){
$scope.orgTypes = ['其他','医院','养老院'];
$scope.viewModel = {}; //一定要先声明这个对象,否则赋值会报错
$scope.viewModel.orgType = $scope.orgTypes[0];
});
</script>
解决方案
$scope.viewModel={
orgType = $scope.orgTypes[0]
}
这篇关于javascript - Angular遍历Radio选项,如何设置某个选项为默认选中状态?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文