دوره آموزشی AngularJS به زبان فارسی - بخش دوازدهم
بسم الله الرحمن الرحیم
این دوره آموزشی تا بخش بیست و دوم مقدماتی خواهد بود اگر به این مطالب تسلط دارید لطفا به آموزش "طراحی یک Single Page Application با ASP.NET Web API و Angular.js " مراجعه کنید.
مشاهده تمامی آموزش های دوره AngularJS
آموزش AngularJS
بخش دوازدهم
AngularJS Forms
یک form AngularJS شامل یک مجموعه از کنترل های ورود اطلاعات است.
HTML Controls
عناصر HTML input را کنترل های HTML می نامند:
• input elements
• select elements
• button elements
• textarea elements
HTML Forms
فرم های HTML عناصر HTML را با یکدیگر گروه بندی می کند.
مثال AngularJS Form
<div ng-app="" ng-controller="formController">
<form novalidate>
First Name:<br>
<input type="text" ng-model="user.firstName"><br>
Last Name:<br>
<input type="text" ng-model="user.lastName">
<br><br>
<button ng-click="reset()">RESET</button>
</form>
<p>form = {{user}}</p>
<p>master = {{master}}</p>
</div>
<script>
function formController ($scope) {
$scope.master = {firstName: "John", lastName: "Doe"};
$scope.reset = function() {
$scope.user = angular.copy($scope.master);
};
$scope.reset();
};
</script>
نکته: خاصیت novalidate برای غیرفعال کردن خاصیت validation پیش فرض مرورگر می باشد.
توضیح مثال
رهنمود ng-model عنصر های input را به model ما مقید می کند.
شی Model ما (master) دارای مقادیر {"firstName" : "John", "lastName" : "Doe"} می باشد.
تابع Model ما (reset) مقدار شی Model کاربر (user) را برابر master قرار می دهد.