angular开发总结二

动态radio操作

功能：单选题提交、获取

思考：

1、每个单选题都有题目、选项两个属性

2、创建单选数组对象，在html页面通过ng-repeat指令实现动态显示

3、设置、获取每个单选value，通过ng-model指令

完整代码：

<div   class="xx overflow" ng-repeat="model in vm.caseOptionItem">
    <div class="kuo2">
        <div class="adian">
            <div class="radio">
                <input name="Fruit" type="radio"  ng-model="vm.symbol" type="radio" ng-value="model.symbol"/> </input>
              
            </div>
        </div>
        <div class="a">{{model.symbol}}:</div>
    </div>
    <div>
        <input class="xznr" ng-model="model.name"/>
    </div>
 </div>

//初始化选项，默认5个
function initCaseOption() {
    vm.caseOptionItem =[];
    vm.symbol = "A";
    for (var i =0;i<5 ;i++){
        vm.caseOption={
            name:"",
            symbol:getOptionChar(i),
            state:true,
            pulseCustomId:""
        };
        vm.caseOptionItem.push(vm.caseOption);
    }
}//根据索引获取选项符号
function getOptionChar(index) {
    var char = "";

    switch (index) {
        case 0:
            char = "A";
            break;
        case 1:
            char = "B";
            break;
        case 2:
            char = "C";
            break;
        case 3:
            char = "D";
            break;
        case 4:
            char = "E";
            break;

    }
    return char;
}

生成好的radio，通过vm.symbol进行获取、设置即可。