• ۲۹
  • مرداد
توضیحات
  • دسته‌بندی‌ها : آموزش جاوا اسکریپت
  • بازدید : 381
جلسه ۱۵ : کار با عناصر HTML DOM در AngularJS
  • جزئیات
  • نوع محتواآموزش تصویری

فیلم های آموزشی آکادمی پی وی لرن

  • آموزش های مرتبط

  • ۲۹
  • مرداد

جلسه ۱۵ : کار با عناصر HTML DOM در AngularJS

  • دسته‌بندی‌ها :
  • بازدید : 381

مقدمه

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

HTML DOM در واقع نمودار درختی ارتباط بین عناصر والد و فرزند است. که با استفاده از هر کدام از عناصر این درخت می توان به عناصر والد یا فزرند یا خواهر و برادر ، دست یافت.

کار با عناصر HTML DOM در AngularJS

AngularJS دارای دستورالعمل هایی برای اتصال داده های برنامه به صفات عناصر HTML DOM است.

دستور ng-disabled

دستورالعمل Ng-disabled  داده های برنامه AngularJS را به ویژگی غیرفعال عناصر HTML متصل می کند.

مثال : عملکرد دستور Ng-disabled

خودتان امتحان کنید »

مثال : 

شرح مثال فوق:

دستورالعمل Ng-disabled  داده های برنامه mySwitch را به ویژگی غیر فعال شده دکمه HTML متصل می کند.

دستورالعمل ng-model مقدار عدد چک باکس HTML را به value mySwitch متصل می کند.

اگر مقدار mySwitch به درستی برسد، دکمه غیرفعال خواهد شد:

مثال : 

اگر مقدار mySwitch  با false برابر باشد. button غیر فعال نمی شود.

مثال : 

دستور ng-show

دستور ng-show برای مخفی کردن یا نمایش عناصر html بکار می رود:

مثال: عملکرد دستور ng-show:

خودتان امتحان کنید »

مثال : 

دستور ng-show  عناصر html را بر اساس مقدار true یا false ، نمایش داده و یا مخفی می کند.

شما می توانید هر عبارتی  را که درست یا غلط بودن را ارزیابی می کند استفاده کنید:

مثال : شکل دیگر مقدار دستور ng-show

خودتان امتحان کنید »

مثال : 

دستور ng-hide

دستور ng-hide نیز برای مخفی کردن یا نمایش عناصر html استفاده می شود:

مثال : عملکرد دستور ng-hide

خودتان امتحان کنید »

مثال : 

کلام آخر

در بررسی آموزش بخش کار با عناصر HTML DOM در AngularJS ، ما شما را با چگونگی دستکاری عناصر dom در AngularJS تا حدودی آشنا کردیم. امیدواریم که مطالب فوق به اندازه ی کافی برای شما مفید بوده باشد.

این پست را ارزیابی کنید
QR:  جلسه ۱۵ : کار با عناصر HTML DOM در AngularJS
به اشتراک بگذارید