Programming Steps: 204 Ionic-v1 Checkbox: Nightly

Friday, June 2, 2017

204 Ionic-v1 Checkbox: Nightly

Checkbox: Nightly
code example:

<html ng-app="ionicApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    
    <title>Checkboxes</title>

<body ng-controller="MainCtrl">
    
    <ion-header-bar class="bar-positive">
      <h1 class="title">Checkboxes</h1>
    </ion-header-bar>
             
    <ion-content>
      
      <div class="list">
        
        <ion-checkbox ng-repeat="item in devList"
                      ng-model="item.checked" 
                      ng-checked="item.checked">
          {{ item.text }}
        </ion-checkbox>
        
        <div class="item">
          <pre ng-bind="devList | json"></pre> 
        </div>
        
        <div class="item item-divider"> 
          Notifications
        </div>
        
        <ion-checkbox ng-model="pushNotification.checked"
                      ng-change="pushNotificationChange()">
          Push Notifications
        </ion-checkbox>
        
        <div class="item">
          <pre ng-bind="pushNotification | json"></pre> 
        </div>
        
        <ion-checkbox ng-model="emailNotification"
                      ng-true-value="'Subscribed'"
                      ng-false-value="'Unubscribed'">
          Newsletter
        </ion-checkbox>
        <div class="item">
          <pre ng-bind="emailNotification | json"></pre> 
        </div>
        
      </div>
      
    </ion-content>
<script>
angular.module('ionicApp', ['ionic'])

.controller('MainCtrl', function($scope) {

$scope.devList = [
    { text: "HTML5", checked: true },
    { text: "CSS3", checked: false },
    { text: "JavaScript", checked: false }
  ];

$scope.pushNotificationChange = function() {
    console.log('Push Notification Change', $scope.pushNotification.checked);
  };
  
  $scope.pushNotification = { checked: true };
  $scope.emailNotification = 'Subscribed';
  
});  
    </script>
  </body>
</html>

201706,20170602

Programming Steps

Learn the powerful enterprise adaptable database:

Getting Started With ADABAS & Natural

Friday, June 2, 2017

204 Ionic-v1 Checkbox: Nightly

No comments:

Post a Comment

Learn the powerful enterprise adaptable database:

Getting Started With ADABAS & Natural

Friday, June 2, 2017

204 Ionic-v1 Checkbox: Nightly

Related Posts:

No comments:

Post a Comment