Skip to content
This repository was archived by the owner on Feb 22, 2018. It is now read-only.

docs(ng-class): expound on the map syntax #512

Merged
merged 1 commit into from
Feb 5, 2014
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 18 additions & 1 deletion lib/directive/ng_class.dart
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,28 @@ part of angular.directive;
*
* index.html:
*
* <p ng-class="{strike: strike, bold: bold, red: red}">Map Syntax Example</p>
* <!--
* The map syntax:
*
* ng-class="{key1: value1, key2: value2, ...}"
*
* results in only adding CSS classes represented by the map keys when
* the corresponding value expressions are truthy.
*
* To use a css class that contains a hyphen (such as line-through in this
* example), you should quote the name to make it a valid map key. You
* may, of course, quote all the map keys for consistency.
* -->
* <p ng-class="{'line-through': strike, bold: bold, red: red}">Map Syntax Example</p>
* <input type="checkbox" ng-model="bold"> bold
* <input type="checkbox" ng-model="strike"> strike
* <input type="checkbox" ng-model="red"> red
* <hr>
*
* <p ng-class="style">Using String Syntax</p>
* <input type="text" ng-model="style" placeholder="Type: bold strike red">
* <hr>
*
* <p ng-class="[style1, style2, style3]">Using Array Syntax</p>
* <input ng-model="style1" placeholder="Type: bold"><br>
* <input ng-model="style2" placeholder="Type: strike"><br>
Expand All @@ -37,6 +51,9 @@ part of angular.directive;
* .strike {
* text-decoration: line-through;
* }
* .line-through {
* text-decoration: line-through;
* }
* .bold {
* font-weight: bold;
* }
Expand Down