گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1396/05/28 - 10:25
كد :7789
در این مقاله ما در باره نحوه کار با صفحات وب داینامیک با کمک آنگولار بحث خواهیم کرد.
آنگولارجی اس دستورالعمل هایی برای ترکیب داده های نرم افزار با عناصر صفحات Html DOM دارد.
دستورالعمل ng-disabled
دستورالعمل ng-disabled داده های نرم افزار آنگولارجی اس را برای غیرفعال کردن صفت یک تگ HTML بکار میبرد.
مثال:
<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">Click Me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
<p>
{{ mySwitch }}
</p>
</div>
مشاهده نتیجه
توضیح نرم افزار:
دستورالعمل ng-disabled داده های نرم افزار را با دستور mySwitch صفت دکمه را در Html به disable تغییر میدهد.
دستورالعمل ng-model مقدار عنصر checkbox در HTML را با مقدار mySwitch ترکیب می کند.
اگر مقدار mySwitch برابر با true باشد دکمه غیر فعال خواهد بود:
<p>
<button disabled>Click Me!</button>
</p>
اگر مقدار mySwitch برابر با false باشد. دکمه فعال میشود:
<p>
<button>Click Me!</button>
</p>
دستورالعمل ng-show:
دستور العمل ng-show یک تگ Html را مخفی یا آشکار می کند.
مثال های آنگولارجی اس
<div ng-app="">
<p ng-show="true">I am visible.</p>
<p ng-show="false">I am not visible.</p>
</div>
مشاهده نتیجه
با کمک مقدار دستورالعمل ng-show میتوانید هر عبارتی را true و false کنید:
مثال
<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">I am visible.</p>
</div>
مشاهده نتیجه
دستورالعمل ng-hide
دستورالعمل ng-hide تگهای HTML را مخفی یا آشکار خواهد کرد.
مثال:
<div ng-app="">
<p ng-hide="true">I am not visible.</p>
<p ng-hide="false">I am visible.</p>
</div>
مشاهده نتیجه
براي بهره مندي از مشاوره تخصصي در زمینه طراحی سایت در کرج با شرکت سارگون تماس بگيريد