Über die Analyse von AngularJs Forms
In diesem Artikel werden hauptsächlich relevante Informationen und einfache Beispielcodes zusammengestellt.
Steuerelemente (Eingabe, Auswahl, Textbereich) sind eine Möglichkeit für Benutzer, Daten einzugeben . Ein Formular ist eine Sammlung dieser Steuerelemente, die dazu dient, verwandte Steuerelemente zu gruppieren.
Formulare und Steuerelemente bieten Validierungsdienste, sodass Benutzer bei ungültigen Eingaben aufgefordert werden können. Dies sorgt für ein besseres Benutzererlebnis, da Benutzer sofortiges Feedback erhalten und wissen, wie sie Fehler beheben können. Bedenken Sie, dass die clientseitige Validierung zwar eine wichtige Rolle bei der Bereitstellung einer guten Benutzererfahrung spielt, sie jedoch leicht umgangen werden kann und daher nicht vertrauenswürdig ist. Für eine sichere Anwendung ist weiterhin eine serverseitige Authentifizierung erforderlich.
1. Einfache Form
Die Schlüsselanweisung zum Verständnis der bidirektionalen Datenbindung ist ngModel. ngModel bietet eine bidirektionale Datenbindung von Modell zu Ansicht und von Ansicht zu Modell. Darüber hinaus stellt es auch APIs für andere Direktiven bereit, um deren Verhalten zu verbessern.
<!DOCTYPE HTML>
<html lang="zh-cn" ng-app="SimpleForm">
<head>
<meta charset="UTF-8">
<title>PropertyEvaluation</title>
<style type="text/css">
.ng-cloak {
display: none;
}
</style>
</head>
<body>
<p ng-controller="MyCtrl" class="ng-cloak">
<form novalidate>
名字: <input ng-model="user.name" type="text"><br/>
Email: <input ng-model="user.email" type="email"><br/>
性别: <input value="男" ng-model="user.gender" type="radio">男
<input value="女" ng-model="user.gender" type="radio">女
<br/>
<button ng-click="reset()">还原上次保存</button>
<button ng-click="update(user)">保存</button>
</form>
<pre class="brush:php;toolbar:false">form = {{user | json}}
saved = {{saved | json}}