HTML DOM AngularJS

AngularJS دستورهایی را ارائه می‌دهد که داده‌های برنامه را به ویژگی‌های عناصر HTML متصل می‌کنند.

دستور ng-disabled

دستور ng-disabled دستور ng-disabled

مثال AngularJS

<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">من را کلیک کن!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
<p>
{{ mySwitch }}
</p>
</div>

به طور مستقیم امتحان کنید

توضیحات کاربرد:

دستور ng-disabled داده‌های برنامه را mySwitch دستور ng-disabled مشخصات HTML دکمه مشخصات ng-model

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

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

<p>
<button disabled>من را کلیک کن!</button>
</p>

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

<p>
<button>من را کلیک کن!</button>
</p>

دستور ng-show

ng-show دستور نمایش یا پنهان کردن عناصر HTML.

مثال AngularJS

<div ng-app="">  
<p نمایش دارد> من قابل مشاهده هستم.</p>  
<p ng-show="false">من قابل مشاهده نیستم.</p>  
</div>

به طور مستقیم امتحان کنید

ng-show دستورالعمل بر اساس ng-showمقدارعناصر HTML را نمایش (یا مخفی) کنید.

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

مثال AngularJS

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">I am visible.</p>
</div>

به طور مستقیم امتحان کنید

در فصل بعدی، مثال‌های بیشتری ارائه خواهد شد که نشان می‌دهد چگونه می‌توان از کلیک دکمه برای مخفی کردن عناصر HTML استفاده کرد.

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

ng-hide دستورالعمل‌ها برای مخفی کردن یا نمایش عناصر HTML.

مثال AngularJS

<div ng-app="">  
<p ng-hide="true">من قابل مشاهده نیستم.</p>  
<p ng-hide="false">من قابل مشاهده هستم.</p>  
</div>

به طور مستقیم امتحان کنید