javascript - 如何使用 Angular.js 验证输入类型单选按钮

Question

我需要使用 Angular.js 验证我的单选按钮字段。让我用下面的代码解释一下。

<form name="myForm"  enctype="multipart/form-data" novalidate>
<div>
<input type="radio"  ng-model="new" value="true" ng-required="!new"> new 
<input type="radio"  ng-model="new" value="false" ng-required="!new">Old
</div> 
<input type="button" class="btn btn-success" ng-click="addData(myForm);"  value="Add" ng-show="myForm.$valid"/>
</form>

这里我需要当用户没有选择任何单选按钮时用户不应该看到添加按钮。我做了一些编码但它不是那样发生的。请帮助我。

Answer 1

var app = angular.module('myApp', []);


app.controller('MyCtrl', ['$scope', function ($scope) {
    $scope.people = [{
        name: "John"
    }, {
        name: "Paul"
    }, {
        name: "George"
    }, {
        name: "Ringo"
    }];
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<form name="myForm" ng-app="myApp" ng-controller="MyCtrl">
    <p>Favorite Beatle</p>
    <ul>
        <li ng-repeat="person in people">
            <label>{{person.name}}
                <input type="radio" ng-model="$parent.name" name="name" value="{{person.name}}" required />
            </label>
        </li>
    </ul>
    <p><tt>myForm.$invalid: {{myForm.$invalid}}</tt></p>
    <button ng-disabled="myForm.$invalid">Submit</button>
</form>