4,500
edits
Angular 2: Difference between revisions
→Built-in Components
| Line 1: | Line 1: | ||
== Built-in Components == | == Built-in Components == | ||
=== <nowiki> | === <nowiki>ngIf</nowiki> === | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
| Line 10: | Line 10: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
=== <nowiki> | === <nowiki>ngSwitch</nowiki> === | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
| Line 20: | Line 20: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
=== <nowiki> | === <nowiki>ngStyle</nowiki> === | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
<div [style.background-color]="'yellow'">Testing</div> | <div [style.background-color]="'yellow'">Testing</div> | ||
| Line 27: | Line 28: | ||
<span [ngStyle]="{color: 'red'}" [style.font-size.px]="fontSize">red text</span> | <span [ngStyle]="{color: 'red'}" [style.font-size.px]="fontSize">red text</span> | ||
</syntaxhighlight> | |||
=== <nowiki>ngClass</nowiki> === | |||
<syntaxhighlight lang="css"> | |||
.bordered { | |||
border: 1px dashed black; | |||
background-color: #eee; | |||
} | |||
</syntaxhighlight> | |||
<syntaxhighlight lang="html"> | |||
<div [ngClass]="{borderd: false}">This is never bordered</div> | |||
<div [ngClass]="{borderd: true}">This is always bordered</div> | |||
</syntaxhighlight> | </syntaxhighlight> | ||