تعليمات AngularJS ng-class

التعريف والاستخدام

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>مرحبًا بعودتك المنزل!</h1>
    <p>أحبها!</p>
</div>

تجربة بنفسك

النحو

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

جميع عناصر HTML يدعمونها.

المتغيرات