Jak mogę włączyć przycisk przesyłania i klawisz [wprowadź] przesłać akcję na formularzu logowania? - angularjs

Mam prosty formularz logowania, który utworzyłem:

     <div ng-form="as.forms.login">

<label for="loginUserName">
User Name
<i class="fa warning"
ng-class="{"fa-exclamation-triangle": as.vloginUserName(as.forms.login.loginUserName) != "OK"}"
title="{{ as.vloginUserName(as.forms.login.loginUserName) }}"></i>
</label>
<input class="w15r"
id="loginUserName"
name="loginUserName"
ng-model="as.loginUserName"
ng-model-options="{ updateOn: "default blur", debounce: { "default": 2000, "blur": 0 } }"
ng-minlength="3"
ng-required
type="text"
value="" />

<label for="loginPassword">
Password
</label>

<input class="w15r"
id="loginPassword"
ng-model="as.loginPassword"
ng-required
type="password" />

<button id="loginButton"
ng-click="as.clearRegisterData(); as.login()">
Login
</button>

</div>

Używam ng-required jako login ihasło należy wypełnić. Czy istnieje sposób Mogę sprawić, aby przycisk logowania był włączony tylko wtedy, gdy pola formularza są prawidłowe? Również jak czy mogę zrobić tak, aby klawisz Enter działał tak samo jak formularz?

Odpowiedzi:

Możesz użyć funkcji sprawdzania poprawności formularza, aby zdecydować, czy włączyć / wyłączyć przycisk wysyłania, i użyć ng-submit aby włączyć klawisz Enter.

 <form name="myForm" ng-submit="as.clearRegisterData(); as.login()">

<label for="loginUserName">
User Name
<i class="fa warning"
ng-class="{"fa-exclamation-triangle": as.vloginUserName(as.forms.login.loginUserName) != "OK"}"
title="{{ as.vloginUserName(as.forms.login.loginUserName) }}"></i>
</label>
<input class="w15r"
id="loginUserName"
name="loginUserName"
ng-model="as.loginUserName"
ng-model-options="{ updateOn: "default blur", debounce: { "default": 2000, "blur": 0 } }"
ng-minlength="3"
ng-required
type="text"
value="" />

<label for="loginPassword">
Password
</label>

<input class="w15r"
id="loginPassword"
ng-model="as.loginPassword"
ng-required
type="password" />

<button type="submit" id="loginButton" ng-disabled="!myForm.$valid">
Login
</button>

</div>

Możesz użyć ng-disabled="formName.$invalid || !as.loginPassword" atrybut na przycisku logowania, aby go wyłączyć, jeśli formularz jest nieprawidłowy (konieczne będzie dodanie nazwy formularza). Jest to ujęte w kątowej dokumentacji formularzy ta strona

możesz użyć ng-keydown w polu wprowadzania hasła, aby sprawdzić klawisz Enter, a następnie sprawdź ważność formularza. Jeśli potrzebujesz przykładowego kodu, możesz znaleźć bardzo prosty przykład tutaj

Powodzenia

Zamiast tego, jeśli ng-kliknij przycisk, przycisk przycisk Wyślij i użyj ng-submit w formularzu.