<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="lib/css/ionic.min.css" rel="stylesheet" />
<script src="lib/js/ionic.bundle.min.js"></script>
<script>
angular.module("myapp", ['ionic'])
.controller("democ", ["$scope", "$ionicSideMenuDelegate", function($scope, $ionicSideMenuDelegate) {
$scope.toggleProjects = function() {
$ionicSideMenuDelegate.toggleLeft(); //toggle
};
}]);
</script>
</head>
<body ng-app="myapp" ng-controller="democ">
<ion-side-menus>
<!-- 中心內容 -->
<ion-side-menu-content>
<!--頭部-->
<ion-header-bar class="bar-dark" ng-click="toggleProjects()">
<button class="button button-icon">
<i class="icon ion-navicon"></i>
</button>
<h1 class="title">Todo</h1>
</ion-header-bar>
<!--內容區域-->
<ion-content>
ppppp
</ion-content>
</ion-side-menu-content>
<!-- 左側菜單 -->
<ion-side-menu side="left">
<ion-header-bar class="bar-dark">
<h1 class="title">Projects</h1>
</ion-header-bar>
</ion-side-menu>
</ion-side-menus>
</body>
</html>
html5_ionic_側拉練習
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.