angular13 记录随笔

将NgClass与表达式一起使用

<div [ngClass]="isSpecial ? 'special' : ''">This div is special</div>

将NgClass与方法一起使用

• app.component.ts

// app.component.ts
setCurrentClasses() {
    this.currentClasses = {
        saveable: this.canSave,
        modified: !this.isUnchanged,
        special: this.isSpecial
    }
}

// app.component.html
<div [ngClass]="currentClasses">This div is initially saveable,unchanged, and special</div>

将NgClass与多个三元表达式一起使用

<div [ngClass]="[item.abled ? 'aaa' : 'bbb', item.selected ? 'ccc' : 'ddd']">This dev is true</div>