Question

我想从模板本身验证我的输入。

输入有效时显示ng-show的范围

我必须知道我在这里做错了什么：

<form name="registerForm" class="js-validation-register form-horizontal push-50-t push-50">
    <div class="form-group">
        <div class="col-xs-12">
            <div class="form-material form-material-primary">
                <input class="form-control" type="text" id="username" name="username" placeholder="Please enter a username" ng-required="true">
                <label for="username">
                    <span ng-show="registerForm.username.$valid" class="text-success"><i class="fa fa-check-circle"></i></span>
                    Username
                </label>
            </div>
        </div>
    </div>
</form>

请你的帮助

Answer 1

您需要在输入中添加ng-modal

<input class="form-control" ng-modal="modal" type="text" id="username" name="username"placeholder="Please enter a username" ng-required="true">

Answer 2

您忘记在输入中添加ng-model。

工作演示：

＆＃13;

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl',function($scope) {
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  <form name="registerForm" class="js-validation-register form-horizontal push-50-t push-50">
    <div class="form-group">
        <div class="col-xs-12">
            <div class="form-material form-material-primary">
                <input class="form-control" type="text" id="username" name="username" placeholder="Please enter a username" ng-model="username" ng-required="true">
                <label for="username">
                    <span ng-show="registerForm.username.$valid" class="text-success">username is valid</span>
                    Username
                </label>
            </div>
        </div>
    </div>
</form>
</div>

＆＃13;

AngularJS在模板上验证

2 个答案: