Angular 2: Difference between revisions

Angular 2 (view source)

766 bytes added , 11 April 2016

4,348

edits

@@ Line 48: / Line 48: @@
 </syntaxhighlight>
------------
+----
 <syntaxhighlight lang="typescript">
@@ Line 61: / Line 61: @@
 <syntaxhighlight lang="html">
 <div [ngClass]="classesObj">Using object var. Border {{classesObj.bordered ? "ON":"OFF"}}</div>
+</syntaxhighlight>
+<syntaxhighlight lang="html">
+<div class="base" [ngClass]="['blue','round']">This will always have a blue and round classes</div>
+</syntaxhighlight>
+<syntaxhighlight lang="typescript">
+this.classList = ['blue','round'];
+</syntaxhighlight>
+<syntaxhighlight lang="html">
+<div class="base" [ngClass]="classList"
+</syntaxhighlight>
+=== <nowiki>ngFor</nowiki> ===
+<syntaxhighlight lang="typescript">
+this.cities = ['Miami','Sao Paulo','New York'];
+</syntaxhighlight>
+<syntaxhighlight lang="html">
+<div class="ui list" *ngFor="#c of cities">
+  <div class="item">{{c}}</div>
+</div>
+</syntaxhighlight>
+adding index
+<syntaxhighlight lang="html">
+<div class="ui list" *ngFor="#c of cities; #num = index">
+  <div class="item">{{num+1}} - {{c}}</div>
+</div>
 </syntaxhighlight>