آموزش انگولار – طراحی سایت، ربات تلگرام و راهکارهای هوش مصنوعی | پشتیبانی 24 ساعته | مشاوره رایگان | Piero.ir https://piero.ir Piero.ir ارائه‌دهنده طراحی سایت حرفه‌ای، ساخت ربات تلگرام، اتوماسیون n8n، هوش مصنوعی، یادگیری ماشین و راه‌اندازی استارتاپ‌های نوآورانه. راهکارهای اختصاصی و مشتری‌محور برای رشد کسب‌وکار شما. Wed, 21 Sep 2016 07:31:32 +0000 fa-IR hourly 1 https://wordpress.org/?v=6.8.3 https://piero.ir/wp-content/uploads/2025/08/logopiero-100x100.png آموزش انگولار – طراحی سایت، ربات تلگرام و راهکارهای هوش مصنوعی | پشتیبانی 24 ساعته | مشاوره رایگان | Piero.ir https://piero.ir 32 32 shopengine_activated_templates a:0:{} آموزش Angular.js https://piero.ir/angular1/ https://piero.ir/angular1/#respond Wed, 21 Sep 2016 07:31:32 +0000 https://piero.ir/2016/09/21/angular1/ آموزش Angular.js

شروع آموزش آنگولار

Angular js یک کتابخانه java script  میباشد که ویژگی های منحصر به فردی در ساخت برنامه های تک صفحه ای بوجود می آورد .

توجه : شما برای مطالعه این مقاله می بایست به زبانهای زیر مسلط باشید.

HTML , CSS , JAVA SCRIPT

<div ng-app=””>

                <input type=”text” ng-model=”name”>

                <div> {{name}}</div>

</div>

همچنین پیشنهاد می شود به یک زبان برنامه نویسی تحت سرور مسلط باشید همانند php

Angular.js چیست؟

یک کتابخانه جاوا اسکریپت می باشد که مابین تگ script بار گزاری می شود مانند jquery  و در تگ های html مورد استفاده قرا می گیرد.

اجزای اصلی Angular.js

Ng-app  حیطه و تعریف برنامه

Ng-model  تعریف کنترلر ها input,select و…

Ng-bind به منظور نمایش نتایج

اولین مثال آموزش Angular.js :

 

<div ng-app=””>

                <input type=”text” ng-model=”name”>

                <div> {{name}}</div>

</div>

خروجی آموزش Angular.js :

هر مقدار درون textbox نوشته شود در پایین ان نشان داده می شود.

 

توجه:پیشنهاد می شود برای خواندن این مقاله ، دارای مهارتهای زیر باشید:

Html,java script,css

آنگولار چطور کار می کند ؟

آنگولار فریم ورک جاوا اسکریپت

آنگولار همانگونه که گفته شد یک فریم ورک جاوا اسکریپت می باشد که می توان آن را در سایت به صورت لوکال یا وابسته به سرور بارگزاری نمود .

بارگزاری از سرور به صورت زیر می باشد:

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>

 

تعریف آنگولار در html

انگولار در html  با استفاده از ng-directives تعریف می شودو شامل قسمتهای زیر می باشد:

Ng-app:تعریف اصلی برنامه انگولار

Ng-model:تعریف اجزای فرم مانند : (input, select, textarea)

Ng-bind:همان گونه که از اسم آن پیداست به منظور نمایش اطلاعات.

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="">
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>

</body>
</html>

 

 

خروجی این برنامه آموزش Angular.js : درون جعبه متن هرچیزی نوشته شود پایین آن نوشته می شود.

]]> https://piero.ir/angular1/feed/ 0