你经常会发现,你想根据组件类中一个变量的状态来添加或删除组件样式。例如,如果用户在表单中输入了错误的信息,表单输入应该突出显示错误。这可以通过使用Angular的NgClass指令来实现。

    NgClass使用一个对象在HTML上添加和删除CSS类。例如我们在下一节课中将使用以下内容:

    1. [ngClass]="{ 'disabled': isSubmitting,
    2. 'btn-outline-secondary': !profile.following,
    3. 'btn-secondary': profile.following }"

    关键是一个CSS类的名称(如disabled),值是我们类中的一个表达式(如isSubmitting),它返回一个布尔值(即truthyfalsy)。只有当表达式的值为真时,才会添加CSS类。

    请看下一课,看看我们是如何使用NgClass的。