قسمت شانزدهم AngularJS :چگونه از event یا رخ داد در انگولار استفاده کنیم؟

قسمت شانزدهم AngularJS :چگونه از event یا رخ داد در انگولار استفاده کنیم؟

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

انگولار جی اس هم دستورالعمل مخصوص خود برای event ها یا رخ داد ها را دارد.

event یا رخ داد

برای فعالسازی دستورالعمل event یا رخ داد ها در انگولار جی اس میتوانید از یک یا چند دستورالعمل زیر استفاده کنید :

ng-blur
ng-change
ng-click
ng-copy
ng-cut
ng-dblclick
ng-focus
ng-keydown
ng-keypress
ng-keyup
ng-mousedown
ng-mouseenter
ng-mouseleave
ng-mousemove
ng-mouseover
ng-mouseup
ng-paste

استفاده از دستورالعمل های بالا در رخ دادهای html باعث میشود که تابع خاص شما اجرا شود.

یک رخ داد انگولار جی اس یک رخ داد HTML را بازنویسی نخواهد کرد، هر دو رویداد اجرا خواهند شد.

رخ داد یا event نشانگر ( موس)

رخ داد نمایشگر هنگامی اجرا میشود که نشانگر یا موس شما روی المنت قرار بگیرد برای استفاده از این دستورالعمل باید از کد های زیر استفاده کنید :

ng-mouseover
ng-mouseenter
ng-mousemove
ng-mouseleave

رخ دادهای زیر هنگامی اجرا میشوند که بر روی المنت خاصی کلیک کنید:

ng-mousedown
ng-mouseup
ng-click

شما میتوانید از رخ داد های موس بر روی هر تگ html استفاده کنید برای درک بهتر این موضوع به مثال زیر توجه کنید.

با کشیدن موس بر روی المنت بالا میبینید که عدد ۰ داده شده تغییر میکند.

دستورالعمل ng-click

همانطور که از تیتر این موضوع مشخص است این دستورالعمل هنگامی اجرا میشود که بر روی المنت خاصی کلیک شود ، برای درک بهتر این موضوع به مثال زیر توجه کنید:

همچنین برای اجرا شدن کد فوق میتوانید از تابعی استفاده کنید ، به مثال زیر توجه کنید :

Toggle, True/False

اگر می خواهید یک بخش از کد اچ تی ام ال را هنگامی که یک دکمه روی آن کلیک می کنید نشان می دهد و هنگامی که دکمه دوباره کلیک می شود، مانند یک منوی کشویی پنهان می شود، دکمه را مانند یک سوئیچ تغییر دهید:

متغیر showMe به عنوان مقدار بولین اشتباه شروع می شود.
تابع myFunc متغیر showMe را با مخالف بودن آن با استفاده از! (نقیض) استفاده میکند.

شی event

هنگام فراخوانی تابع می توانید از شی $event به عنوان یک پارامتر عبور کنید.
شی $event حاوی رویداد مرورگر است:

امیدوارم این اموزش برای شما مفید واقع شده باشد.

برای مطالعه مطالب بیشتر میتوانید به سایت w3schools مراجعه فرمایید.

موفق باشید.

برچسب ها : event، اموزش angularjs

دیدگاه تازه ای بنویسید