fix(checkbox): support for ng-checked

Added support and demo for ng-checked usages.

Fixes #1550.

src/components/checkbox/checkbox.js

@@ -111,7 +111,9 @@ function MdCheckboxDirective(inputDirective, $mdInkRipple, $mdAria, $mdConstant,
 
         scope.$apply(function() {
           // Toggle the checkbox value...
-          ngModelCtrl.$setViewValue( !ngModelCtrl.$viewValue, ev && ev.type);
+          var viewValue = attr.ngChecked ? attr.checked : !ngModelCtrl.$viewValue;
+
+          ngModelCtrl.$setViewValue( viewValue, ev && ev.type);
           ngModelCtrl.$render();
         });
       }

src/components/checkbox/demoBasicUsage/index.html

@@ -1,5 +1,6 @@
 
-<div ng-controller="AppCtrl">
+<div ng-controller="AppCtrl" layout-padding >
+  <p> Using ngModel: </p>
   <div>
     <md-checkbox ng-model="data.cb1" aria-label="Checkbox 1">
       Checkbox 1: {{ data.cb1 }}

src/components/checkbox/demoSyncing/index.html

@@ -0,0 +1,30 @@
+<div ng-controller="AppCtrl" layout-padding >
+  <p> Using ngChecked: </p>
+
+  <div layout="row" layout-padding>
+
+    <fieldset layout="column">
+      <legend>Using &lt;md-checkbox&gt;</legend>
+      <md-checkbox ng-repeat="item in items" ng-checked="exists(item, selected)" ng-click="toggle(item, selected)">
+        {{ item }} <span ng-if="exists(item, selected)">selected</span>
+      </md-checkbox>
+    </fieldset>
+
+    <fieldset layout="column" class="standard">
+      <legend>Using &lt;input type="checkbox"&gt;</legend>
+      <div ng-repeat="item in items" class="standard" >
+        <label>
+          <input type="checkbox" ng-checked="exists(item, selected)" ng-click="toggle(item, selected)"/>
+          {{ item }}
+        </label>
+      </div>
+    </fieldset>
+
+  </div>
+
+  <div layout="column">
+    <md-checkbox ng-checked="selected.length >= 2" disabled>Two or more items are selected</md-checkbox>
+    <span class="info">Selected: {{ selected }}</span>
+  </div>
+
+</div>

src/components/checkbox/demoSyncing/script.js

@@ -0,0 +1,18 @@
+
+angular.module('checkboxDemo1', ['ngMaterial'])
+
+.controller('AppCtrl', function($scope) {
+
+    $scope.items = [1,2,3,4,5];
+      $scope.selected = [];
+
+      $scope.toggle = function (item, list) {
+        var idx = list.indexOf(item);
+        if (idx > -1) list.splice(idx, 1);
+        else list.push(item);
+      };
+
+      $scope.exists = function (item, list) {
+        return list.indexOf(item) > -1;
+      };
+});

src/components/checkbox/demoSyncing/style.css

@@ -0,0 +1,26 @@
+.checkboxDemo1 div {
+  clear: both;
+}
+.checkboxDemo1 md-checkbox {
+  float: left;
+}
+
+legend {
+  color : #0000ba;
+}
+
+p {
+  padding-left : 10px;
+}
+
+.info {
+  padding-left:13px;
+}
+
+div.standard {
+  padding:10px;  padding-left:15px;
+}
+
+fieldset.standard {
+  margin-left:10px;
+}