4,348
edits
→ngClass
| Line 42: | Line 42: | ||
<div [ngClass]="{borderd: false}">This is never bordered</div> | <div [ngClass]="{borderd: false}">This is never bordered</div> | ||
<div [ngClass]="{borderd: true}">This is always bordered</div> | <div [ngClass]="{borderd: true}">This is always bordered</div> | ||
</syntaxhighlight> | |||
<syntaxhighlight lang="html"> | |||
<div [ngClass]="{borderd: isBordered}">Using object literal. Border {{ isBordered ? "ON":"OFF" }}</div> | |||
</syntaxhighlight> | |||
----------- | |||
<syntaxhighlight lang="typescript"> | |||
toggleBorder() { | |||
this.isBordered = !this.isBordered; | |||
this.classesObj = { | |||
bordered: this.isBordered | |||
}; | |||
} | |||
</syntaxhighlight> | |||
<syntaxhighlight lang="html"> | |||
<div [ngClass]="classesObj">Using object var. Border {{classesObj.bordered ? "ON":"OFF"}}</div> | |||
</syntaxhighlight> | </syntaxhighlight> | ||