คำแนะนำคอร์ส:

AngularJS HTML DOM

AngularJS มีคำสั่งที่จะนำข้อมูลของโปรแกรมมาบอกความจริงของคุณสมบัติขององค์ประกอบ HTML

ใช้งาน: คำสั่ง ng-disabled

ตัวอย่าง AngularJS

คำสั่งจะนำข้อมูลของ AngularJS มาบอกความจริงของคุณสมบัติ disabled ขององค์ประกอบ HTML
<p>
<div ng-app="" ng-init="mySwitch=true">
</p>
<p>
<button ng-disabled="mySwitch">กดฉัน!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
</div>

ทดลองด้วยตัวเอง

{{ mySwitch }}

ใช้งาน: ng-disabled mySwitch คำสั่งจะนำข้อมูลของโปรแกรมมานำไปใช้กับปุ่ม HTML ตามคำสั่ง ตามคุณสมบัติ

ng-model คำสั่งจะบอกความจริงของตัวเลือก HTML ไปที่ตัวแปร mySwitch ค่าของมัน

ถ้า mySwitch มีค่า trueจะบล็อคปุ่ม:

<p>
<button disabled>กดฉัน!</button>
</p>

ถ้า mySwitch มีค่า falseถ้าไม่มีการบล็อค:

<p>
<button>กดฉัน!</button>
</p>

คำสั่ง ng-show

ng-show คำสั่งแสดงหรือซ่อนองค์ประกอบ HTML。

ตัวอย่าง AngularJS

<div ng-app="">  
<p ng-show="true">ฉันเห็นได้。</p>  
<p ng-show="false">ฉันไม่เห็น。</p>  
</div>

ทดลองด้วยตัวเอง

ng-show สั่งออกเกี่ยวกับ ng-showค่าแสดง (หรือซ่อน) อิเล็กทรอนิกส์อีเมล

คุณสามารถใช้ใบแสดงที่ประเมินว่าเป็นความจริงหรือเท็จ

ตัวอย่าง AngularJS

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

ทดลองด้วยตัวเอง

ในบทดั้งต่อไป จะมีตัวอย่างเพิ่มเติมแสดงว่าจะแสดงหรือซ่อนอิเล็กทรอนิกส์อีเมลโดยใช้ปุ่มคลิก

สั่งออก ng-hide

ng-hide สั่งออกซ่อนหรือแสดงอิเล็กทรอนิกส์อีเมล

ตัวอย่าง AngularJS

<div ng-app="">  
<p ng-hide="true">ฉันไม่เห็น。</p>  
<p ng-hide="false">ฉันเห็นได้。</p>  
</div>

ทดลองด้วยตัวเอง