HTML DOM با آنگولار جی اس – angular js
AngularJS دارای دستورالعمل هایی برای اتصال داده های برنامه به صفات (attribute) عناصر HTML DOM است.
مقالات
دستور ng-disabled
دستور ng-disabled متصل شده به داده های برنامه AngularJS را به ویژگی غیرفعال عناصر HTML متصل می کند.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<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 متصل می کند.
دستورالعمل “ng-model” ، value عنصر جعبه HTML را به مقدار mySwitch متصل می کند.
اگر مقدار mySwitch ،True باشد ، دکمه غیرفعال خواهد شد:
|
1 2 3 |
<p> <button disabled>Click Me!</button> </p> |
اگر مقدار mySwitch ،Falseباشد ، دکمه غیرفعال خواهد شد:
|
1 2 3 |
<p> <button>Click Me!</button> </p> |
دستور ng-show
با directive یا دستور ng-show عناصر مخفی HTML را نمایش میدهد.
|
1 2 3 4 5 6 7 |
<div ng-app=""> <p ng-show="true">I am visible.</p> <p ng-show="false">I am not visible.</p> </div> |
دستور “ng show” یک عنصر HTML را بر اساس مقدار ng-show نشان می دهد (یا پنهان می کند).
شما می توانید هر expresson را true یا false که ارزیابی می کند استفاده کنید.
دستور ng-hide
دستور ng-hide یک عنصر HTML را نمایش میدهد یا نمی دهد.
|
1 2 3 4 5 6 7 |
<div ng-app=""> <p ng-hide="true">I am not visible.</p> <p ng-hide="false">I am visible.</p> </div> |
مطالب زیر را حتما مطالعه کنید
مسیریابی انگولار AngularJS Routing
ساخت انیمیشن با انگولار – angularjs animation
AngularJS Includes
api آنگولار جی اس – Angularjs API
اعتبارسنجی فرم ها با آنگولار – AngularJS Form Validation
دیدگاهتان را بنویسید