奇酷學(xué)院老師html5高級(jí)就業(yè)大講堂ionic-09復(fù)選單選

1、onic 復(fù)選框ionic 復(fù)選框（checkbox）與普通的 HTML 復(fù)選框沒什么區(qū)別，以下實(shí)例演示了 ionic 復(fù)選框 ion-checkbox 的應(yīng)用。復(fù)選框?qū)嵗龑?shí)例中，會(huì)根據(jù)復(fù)選框是否選中，修改 checked 值，true 為選中， false 為未選中。HTML 代碼復(fù)選框 item.text NotificationsPush NotificationsNewsletterJavaScript 代碼angular.module(starter, ionic).run(function($ionicPlatform) .controller( actionsheetCtl,$s

2、cope,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.Notifica

3、tion = Subscribed;)css 代碼：body cursor: url(htt/try/demo_source/fingng), auto;嘗試一下 效果如下所示：ionic 單選框操作實(shí)例中，根據(jù)選中的不同選項(xiàng)，顯示不同的值。HTML 代碼當(dāng)選按鈕選取的值為: dntSide item.text Serverside, Selected Value: data.serverSide item.text JavaScript 代碼angular.module(ionicApp, ionic).controller(MainCtrl, function($scope) $tSide

4、List = text: Backbone, value: bb , text: Angular, value: ng , text: Ember, value: em , text: Knockout, value: ko ;$scope.serverSideList = text: Go, value: go , text: , value: py , text: Ruby, value: rb , text: Java, value: jv ;$scope.data = cntSide: ng;$scope.serverSideChange = function(item) consol

5、e.log(Selected Serverside, text:, item.text, value:, item.value););ionic 切換開關(guān)操作以下實(shí)例中，通過切換不同開關(guān) checked 顯示不同的值，true 為打開，false 為關(guān)閉。HTML 代碼開關(guān)切換Settings item.text NotificationsPush NotificationsNewsletter由于 pre，實(shí)例中的 pre 已替換為 div，具體可以在嘗試一下中查看。JavaScript 代碼angular.module(ionicApp, ionic).controller(MainCtrl, function($scope) $scope.settingsList = text: Wireless, checked: true , text: GPS, checked: false , text: Bluetooth, checked: false ;$scope.pushNotificationChange = function() console.log(Push Notification Change, $scope.pushNotification.c