javascript - 从选定的单选按钮获取 angularjs 值

Question

我搜索并尝试了许多不同版本的代码，但没有找到任何答案。

我的代码是:

<div class="well">
    <h3>{{policies.aul.name}}</h3>
    <ul style="list-style: none;">
        <li ng-repeat="p in policies.aul.policies | orderBy:'!pName' ">
            <input type="radio" ng-model="aulPolicy.checked" name="{{policies.aul.name}}" ng-value="{{p.pName}}" required /> {{p.pName}}
        </li>
    </ul>
    selected: {{aulPolicy.checked}} or {{policies.aul.name}}
    <input type="submit" class="btn btn-primary" onclick="javascript:generateTableA('{{aulPolicy}}')" value="Build">
    <input ng-hide="!aData" type="submit" class="btn btn-primary" value="Add Table" disabled="true">
    </span>
</div>

代码:selected: {{aulPolicy.checked}} or {{policies.aul.name}} 不显示任何checked，它显示>aul.name.

有什么想法吗？

下面我添加了我的 json:

{"aul":{"name":"American United Life",
"policies":[{
    "pName":"standard",
    "header":[{"name":"Policy Year","total":false},{"name": "Age","total":false},
    {"name":"Contract Premium","total":true},{"name":"Cash Value","total":false},
    {"name":"PUA Cash Value","total":false},{"name":"Death Benefit","total":false},
    {"name":"Total Annual Outlay","total":false},{"name":"PUA Cash Value","total":false},
    {"name":"Total Net Cash Value","total":false},{"name":"PUA Death Benefit","total":false},
    {"name":"OTA Death Benefit","total":false},{"name":"Total Net Death Benefit","total":false},
    {"name":"Total","total":false}],
    "cols":12
    },
    {"pName":"offset",
        "header":[],
        "cols":13
    },
    {"pName":"level trem",
        "header":[],
        "cols":13
    },
    {"pName":"blended term",
        "header":[],
        "cols":13
    },
    {"pName":"blended and level",
        "header":[],
        "cols":12
    },
    {"pName":"blended and level and offset",
        "header":[],
        "cols":15
    }]
}

}

Answer 1

我认为下面的工作代码会对您有所帮助。

var app = angular.module('plunker', []);
app.controller('MainCtrl', function ($scope) {
    $scope.policies = {
        aul: {
            name: 'Test',
            policies: [
            { pName: '1' },
            { pName: '2' },
            { pName: '3' },
            { pName: '4' },
            { pName: '5' }
            ]
        }
    };
    $scope.aulPolicy = {};

});

    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" ></script>
   <div ng-app="plunker" ng-controller="MainCtrl">
        <div class="well">
            <h3>{{policies.aul.name}}</h3>
            <ul style="list-style: none;">
                <li ng-repeat="p in policies.aul.policies | orderBy:'!pName' ">
                    <input type="radio" ng-model="aulPolicy.checked" name="{{policies.aul.name}}" ng-value="{{p.pName}}" required />
                    {{p.pName}}
                </li>
            </ul>
            selected: {{aulPolicy.checked}} or {{policies.aul.name}}
          <input type="submit" class="btn btn-primary" value="Build" />
          <input ng-hide="!aData" type="submit" class="btn btn-primary" value="Add Table" disabled="true" />
        </div>
    </div>