Question

在我的表单中，我想确保输入一封电子邮件并输入密码。这是否可以使用angularJS工具开箱即用？这就是我目前所拥有的：

<ion-view title="Welcome">
    <ion-content>
        <div class="list">
            <form name="signInForm">

              <label class="item item-input item-stacked-label">
                <input name="user.email" data-ng-model="user.email" type="email" placeholder="user@email.net">
              </label>

              <label class="item item-input item-stacked-label">
                <input ng-model="user.password" type="password" placeholder="password">
              </label>

              {{ signInForm["user.email"] }}
                <button data-ng-click="signInClick()" data-ng-disabled="signInForm.$invalid" class="button button-full button-positive">
                Sign In
                </button>

              <div class="button-bar">
                  <a href="#/sign-up" class="button">Sign Up</a>
                  <a href="#/forgot-password" class="button"><em>Forgot Password</em></a>
                </div>

            </form>
        </div>
    </ion-content>
</ion-view>

我最大的问题是，即使没有输入密码，该按钮也会变为可点击。我该如何解决这个问题？

Answer 1

只需将required放在电子邮件和密码字段

上即可

<label class="item item-input item-stacked-label">
  <input name="user.email" data-ng-model="user.email" type="email" placeholder="user@email.net" required>
</label>

<label class="item item-input item-stacked-label">
  <input ng-model="user.password" type="password" placeholder="password" required>
</label>

Answer 2

在输入字段上使用“required”并检查表单验证。

                <input name="user.email" data-ng-model="user.email" type="email" placeholder="user@email.net" required>

                <input ng-model="user.password" type="password" placeholder="password" required>

AngularJS基本表单验证

2 个答案: