我的Angular代码出了什么问题?我得到以下错误:
无法读取BrowserDomAdapter.removeClass中未定义的属性“remove”
<ol>
<li *ngClass="{active: step==='step1'}" (click)="step='step1'">Step1</li>
<li *ngClass="{active: step==='step2'}" (click)="step='step2'">Step2</li>
<li *ngClass="{active: step==='step3'}" (click)="step='step3'">Step3</li>
</ol>
当前回答
Angular提供了多种有条件地添加类的方法:
第一个方法
Active是您的类名
[class.active]="step === 'step1'"
第二种方式
Active是您的类名
[ngClass]="{'active': step=='step1'}"
第三条道路
通过使用三元运算符class1和class2是你的类名
[ngClass]="(step=='step1')?'class1':'class2'"
其他回答
Angular提供了多种有条件地添加类的方法:
第一个方法
Active是您的类名
[class.active]="step === 'step1'"
第二种方式
Active是您的类名
[ngClass]="{'active': step=='step1'}"
第三条道路
通过使用三元运算符class1和class2是你的类名
[ngClass]="(step=='step1')?'class1':'class2'"
这对我来说很管用:
[ngClass]="{'active': dashboardComponent.selected_menu == 'profile'}"
如果用户想显示基于&&和||的类 下面是我的工作
[ngClass]="{'clasname_1': condition_1 && condition_2, 'classname_2': condition_1 && condition2, 'classname_3': condition}"
例子:
[ngClass]="{'approval-panel-mat-drawer-side-left': similar_toil_mode==='side' && showsTheSimilarToilsWithCloseIcon, 'approval-panel-mat-drawer-side-right': similar_toil_mode==='side' && !showsTheSimilarToilsWithCloseIcon, 'approval-panel-mat-drawer-over': similar_toil_mode==='over'}"
在Angular 7中。X
根据表达式求值的类型，CSS类的更新如下:
string -添加字符串中列出的CSS类(空格分隔) Array—添加声明为Array元素的CSS类 对象键是CSS类，当值中给出的表达式计算为真值时添加，否则将删除它们。
<some-element [ngClass]="'first second'">...</some-element>
<some-element [ngClass]="['first', 'second']">...</some-element>
<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>
<some-element [ngClass]="stringExp|arrayExp|objExp">...</some-element>
<some-element [ngClass]="{'class1 class2 class3' : true}">...</some-element>
对于elseif语句(较少比较)，使用如下语句:(例如，比较三个语句)
<div [ngClass]="step === 'step1' ? 'class1' : (step === 'step2' ? 'class2' : 'class3')"> {{step}} </div>
