AngularJS ng-class directive

การประกาศและวิธีใช้

ng-class คำสั่งนี้ใช้เพื่อการแนบชั้น CSS หนึ่งหรือหลายชั้นไปยังองค์ประกอบ HTML

ng-class ค่าของคำสั่งนั้นสามารถเป็นตัวอักษร วัตถุ หรือแบบจำลอง

ถ้ามันเป็นตัวอักษร มันควรมีชื่อชั้นหนึ่งหรือหลายชื่อชั้นที่แยกด้วยช่องว่าง

เป็นวัตถุ มันควรมีคู่ความเกี่ยวข้องที่มีกุญแจและค่า ในที่สุดกุญแจคือชื่อของชั้นที่คุณต้องการเพิ่ม และค่าคือค่าบูลีน มันจะเพิ่มชั้นนั้นเมื่อค่านั้นจัดระบบเป็น true

ในรูปแบบของตัวแยก มันสามารถเป็นการผสมผสานของทั้งสอง แต่ละองค์ประกอบของตัวแยกสามารถเป็นตัวแปรของตัวแสดงค่าหรือตัวแปร

ตัวอย่าง

เปลี่ยนคลาสของ <div> ด้วย

<select ng-model="home">
    <option value="sky">Sky</option>
    <option value="tomato">Tomato</option>
</select>
<div ng-class="home">
    <h1>Welcome Home!</h1>
    <p>I like it!</p>
</div>

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

การใช้งาน

<element ng-class="expression</element>

ทุกองค์ประกอบ HTML สนับสนุน

ตัวแปร