آموزش AngularJS

AngularJS کتابخانهای برپایهی جاوااسکریپت است که به منظور تولید نرمافزارهای تحت وب توسط گوگل توسعه پیدا کرده است. ایدهی اصلی AngularJS، اضافه کردن امکاناتی به HTML است تا آن را از یک زبان نشانگذاری ساده خارج کند و ابزارهای لازم برای تولید یک نرمافزار داده محور را به سادهترین شکل ممکن فراهم نماید. امکانات متنوعی در این کتابخانه وجود دارد. ویژگی اصلی AngularJS، ایجاد ارتباط پویا میان دادههای ورودی و خروجی است. به این معنی که به سادگی میتوانید اطلاعات دریافت شده از کاربر را به صورت خودکار جمعآوری کنید، پردازش کنید، در محلهای دلخواه نمایش دهید یا به سرور بفرستید. به عبارت دیگر، AngularJS ابزاری است که برنامهنویسی MVC را به معنای واقعی در محیط وب دستیافتنی میکند. با استفاده از AngularJS میتوان در یک صفحهی وب، چندین Application مجزا از هم ایجاد کرد که هر یک به پایگاه دادهای مجزا متصل میشوند و اطلاعات را ارسال و دریافت میکنند.
آموزش کامل AngularJS

AngularJS یک کتابخانه ی جاوا اسکریپت است که قابلیت های جدید به HTML اضافه می کند. AngularJS برای کار با SPA بسیار مناسب می باشد...

AngularJS با بهره گیری از عبارت ها داده ها را به HTML مقید (bind) می کند. عبارات در AngularJS داخل {{ expression }} نوشته و درج می شوند. کار آن ها این است که مثل دستور ng-bind داده ها رو به HTML مقید (bind) می کنند و در هر جایی که قرار دارند داده ها را جایگزین خود می سازند.

در AngularJS، ماژول یک برنامه را تعریف می کند.ماژول در حقیقت نقش یک ظرف برای نگهداری بخش های مختلف یک برنامه را ایفا می کند...

Angular یک چارچوب کاری یا کتابخانه ی جاوا اسکریپت هست که به کمک خصیصه های نوینی به نام Directive ها(دستور ها)، به برنامه نویس یا طراح وب این اجازه را می دهد که HTML را بسط داده و قابلیت های آن را گسترش دهد...

AngularJS یک چارچوب کاری open source برای توسعه ی برنامه های تحت وب (web application) است. این تکنولوژی برای اولین بار توسط Misko Hevery و Adam Abrons در سال 2009 معرفی شده و هم اکنون توسط Google پشتیبانی می شود.

دایرکتیو ng-model مقادیر کنترلی(HTML(input,select,textarea را به داده های برنامه پیوند می دهد.شما با استفاده از دایرکتیو ng-model می توانید مقدار یک input را به متغیری که در AngularJS ساخته شده است، پیوند دهید...

AngularJS به شما این امکان را می دهد تا بر اساس لیستی از عناصر درون یک آرایه و یا یک شی(object)،یک dropdown بسازید....

controller ها کلاسهای جاوا اسکریپت هستند. زمانی که کاربر با برنامه تعامل برقرار می کند controller پاسخگوی مستقیم دستورات کاربر می باشد و مدل را تغییر می دهد. به کنترلگرها بخش منطق برنامه نیز گفته می شود...

Scope را می توان به چند طریق تعریف کرد: به قسمتی که( HTML (view و JavaScript (Controller را بهم پیوند می دهد ، Scope می گویند.به یک object با ویژگی ها و متدهای قابل دسترس نیز Scope می گویند. Scope هم برای view و هم برای Controller قابل دسترس می باشد...

فیلترها را می توان با یک کاراکتر " | " به عبارات (expression) و directive )دستورات ( اضافه کرد...

سرویس چیست؟در AngularJS، سرویس یک تابع و یا object است که برای برنامه کاربردی AngularJS قابل دسترس و یا محدود شده باشد. AngularJS حدود 30 سرویس پیش ساخته شده دارد...

$http یک سرویس AngularJS است که جهت خواندن داده ها از سرورهای راه دور (remote server) بکار می رود...

دستور ng-repeat بهترین گزینه برای نمایش دادن جدول ها می باشد...

Bootstrap یک صفحه ی سبک دهی (style sheet) پرطرفدار است. مقاله ی حاضر نحوه ی استفاده از angular به همراه bootstrap را به شما آموزش می دهد...

Model–view–controller یا به اختصار(MVC مدل - نما - کنترلگر) به یک الگوی معماری برنامه گفته میشود. الگوی ساختاری MVC به جداسازی دادههای کاربرد

واکشی اطلاعات از یک سرویس دهنده ی PHP که پایگاه داده ی MySQL بر روی آن مستقر است...

AngularJS دارای دستورهایی برای پیوند دادن (bind کردن) داده های برنامه های Angular به خصیصه ها یا attribute های عناصر HTML DOM است...

دستور ng-click یک رخداد تعریف می کند که به محض کلیک بر روی دکمه توسط کاربر، اجرا می شود...

فرم در AngularJS عبارت است از یک مجموعه از کنترل ها که ورودی دریافت می کنند...

کنترل ها و فرم های دریافت کننده ی ورودی این قابلیت را دارند که داده های ورودی را اعتبارسنجی کنند...

توابع API سراسری AngularJS، با استفاده از شی angular قابل دسترسی می باشند.در زیر فهرستی از توابع API متعارف AngularJS برای شما به نمایش گذاشته شده است...

ابتدا بررسی می کنیم بخش های اصلی تشکیل دهنده ی برنامه ی AngularJS کدام اند. یک برنامه ی ساده ی AngularJS از سه بخش اصلی زیر تشکیل می شود

شما می توانید به آسانی از w3.css و AngularJS با هم استفاده کنید. در این مقاله قصد داریم نحوه انجام این کار را به شما آموزش دهیم...

با بهره گیری از AngularJS می توان فایل های HTML را درون صفحه ی HTML دیگر گنجاند...

انیمیشن چیست؟هرگاه تغییر وضعیت در یک المان HTML صورت گیرد، این حالت را به اصطلاح انیمیشن می گویند.برای آماده کردن برنامه کاربردی خود به حالت انیمیشن، شما باید کتابخانه AngularJS Animate را به قسمت head برنامه خود اضافه کنید...

با مطالبی آموزش هایی که تاکنون آموخته ایم، حال می توانیم یک برنامه ی تک صفحه ای (SPA) را به طور واقعی بسازیم...

به وسیله ی Directive ها می توان المان های جدید به HTML افزود و یا خصیصه های (attribute) جدید به المان های موجود اضافه کرد. Directive ها به منظور بسط المان های HTML به کار می روند.

از عبارت ها ( (expressionبرای متصل کردن داده های Application به HTML استفاده می شود. عبارت ها داخل کاراکترهای باز و بسته ی {{ }} بدین صورت بکار گرفته می شوند: {{ expression}}. عبارت ها رفتار یا عملکردی مشابه directive های ng-bind دارند.

برنامه های نوشته شده توسط AngularJS بیشتر از controller ها به منظور کنترل و مدیریت داده ها بهره می گیرند. به منظور تعریف یک controller باید از ng-controller directive استفاده کرد. controller در واقع یک شی JavaScript است که دارای property/attribute ها و توابع می باشد.

فیلترها به منظور اصلاح داده ها به کار می روند. فیلترها این اجازه را به برنامه نویس می دهند که نحوه ی فرمت (تبدیل) کردن داده ها را برای نمایش به کاربر تعریف کند. می توان فیلترها را با استفاده از کاراکتر " | " به directive ها یا expression ها اضافه کرد. در زیر تعدادی از فیلترهای پرکاربرد را مشاهده می کنید

داده های جدول به طور معمول قابل تکرار هستند. با استفاده از ng-repeat directive می توان به راحتی جدول رسم کرد. مثال زیر کاربرد directive مزبور را برای رسم جدول، نمایش می دهد.

AngularJS برای برای متصل کردن داده های برنامه (app data) به خصیصه های (attribute) المان های HTML DOM از Directive ها بهره می گیرد.

Modular approach یک رویکرد یا شیوه ی خاص طراحی نرمافزار است برای افزایش وسعت نرم افزاری که از قسمتهای مجزایی به نام module یا به فارسی ماژول تشکیل شده است.

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

AngularJS با ارائه ی سرویس/کنترل $http از سرورهای راه دور (remote server) داده می خواند. Server پایگاه داده را را صدا زده و record های مورد نظر را دریافت می کند. داده های AngularJS باید با فرمت JSON نوشته شوند (در قالب JSON ریخته شوند). پس از آماده شدن داده، می توان آن ها را با کمک $http دریافت کرد.

AngularJS با ارائه ی قابلیت گنجاندن چندین view (نما) در یک صفحه از الگوی طراحی SPA پشتیبانی می کند. برای فراهم آمدن این امکان AngularJS، Directive های ng-view و ng-template و همچنین سرویس $routeProvider را بکار می برد.

Scope (حوزه ی دسترسی) یک شی خاص جاوا اسکریپت است که وظیفه ی متصل کردن controller به view ها را بر عهده دارد. Scope دربردارنده ی داده های modelمی باشد.

AngularJS با بهره گیری از معماری service ها قابلیت "Seperation of Concerns" (جداسازی مسئولیت ها) را پشتیبانی می کند. Service ها توابع جاوا اسکریپتی هستند که تنها وظیفه ی انجام یک task یا کار مشخص را بر عهده دارند. این امر باعث می شود