ionic 侧边栏实例
侧边栏的使用范例:
<body >
<ion-side-menus>
<!-- 中间内容 -->
<ion-side-menu-content ng-controller="ContentController">
<ion-header-bar align-title="left" class="bar-positive">
<div class="buttons">
<button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
</div>
<h1 class="title" style="text-align: center;">Title!</h1>
<div class="buttons">
<button class="button">右侧按钮</button> </div> </ion-header-bar>
</ion-side-menu-content> <!-- 左侧菜单 -->
<ion-side-menu side="left" width="180">
left-side-menu
</ion-side-menu> <!-- 右侧菜单 -->
<ion-side-menu side="right">
</ion-side-menu>
</ion-side-menus>
<script type="text/javascript">
angular.module('ionicApp',['ionic'])
.controller('ContentController',function($scope, $ionicSideMenuDelegate){
$scope.toggleLeft = function() {
$ionicSideMenuDelegate.toggleLeft();
}; }); </script>
</body>
ionic 侧边栏实例的更多相关文章
- 没有苹果电脑打包iOS平台的 Ionic 2程序——《Ionic 2 实例开发》更新内容
没有苹果电脑打包iOS平台的 Ionic 2程序--<Ionic 2 实例开发>更新内容春节刚过,祝各位新的一年里万事如意,一帆风顺.<Ionic 2 实例开发>在这段时间里更 ...
- ionic 开发实例
ionic 开发实例 一.ionic初始化项目 1:安装ionic npm install -g ionic 2:初始化项目框架 我们可以用命令创建一个应用程序,可以使用我们的一个现成的应用程序模板, ...
- 《Ionic 2 实例开发》发布
Ionic 2系列教程集结成册,在百度阅读上架发布,名为<Ionic 2实例开发>(点击书名将打开地址:http://yuedu.baidu.com/ebook/ba1bca51e4189 ...
- Ionic 2 中创建一个照片倾斜浏览组件
内容简介 今天介绍一个新的UI元素,就是当我们改变设备的方向时,我们可以看到照片的不同部分,有一种身临其境的感觉,类似于360全景视图在移动设备上的应用. 倾斜照片浏览 Ionic 2 实例开发 新增 ...
- 观《phonegap第三季 angularjs+ionic视频教程 实时发布》学习笔记(三)
十五.ionic路由 1.ionic中内联模板介绍 使用内联模板内联模板的使用,常见的有几种情况.(1) 使用ng-include指令可以利用ng-include指令在HTML中直接使用内联模板,例如 ...
- 关于ionic开发中遇到的坑与总结
这次是第二次使用ionic开发混合app,今天算是对这个框架做一个总结,基础的我就不再重复了,网上都有教程.我就说说自己的心得和遇见的各种坑, 之后会陆续补充,想到什么说什么吧. 1.关于ionic效 ...
- Ionic 2 中添加图表
有问题请加入马画藤群:181596813,也强烈欢迎各类建议和需求:Ionic 2 实例开发 今日更新新增章节——Ionic 2 中添加图表: Chart.js是一个在HTML5的<canvas ...
- Ionic 2 中的创建一个闪视卡片组件
闪视卡片是记忆信息的重要工具,它的使用可以追溯到19世纪.我们将要创建一个很酷的短暂动画来实现它.看起来像是这个样子的: 闪视卡片示例 Ionic 2 实例开发 新增章节将为你介绍如何在Ionic 2 ...
- Web前端开发推荐阅读书籍、学习课程下载
转自http://www.xuanfengge.com/fe-books.html 前言 学校里没有前端的课程,那如何学习JavaScript,又如何使自己成为一个合格的前端工程师呢? 除了在项目中学 ...
随机推荐
- 【Flutter 实战】简约而不简单的计算器
老孟导读:这是 [Flutter 实战]组件系列文章的最后一篇,其他组件地址:http://laomengit.com/guide/widgets/Text.html,接下来将会讲解动画系列,关注老孟 ...
- MySQL 8.0 主从同步
一.简介 一台服务器充当主数据库服务器,另一台或多台服务器充当从数据库服务器,主服务器中的数据自动复制到从服务器之中.MySQL主从复制的基础是主服务器对数据库修改记录二进制日志,从服务器通过主服务器 ...
- CentOS7开机报错piix4_smbus ****host smbus controller not enabled
vi /etc/modprobe.d/blacklist.conf 输入:blacklist i2c_piix4 保存退出::wq 重启:reboot (完)
- vs 打开项目,发现项目中通过nuget引用的dll都不可用的解决方法
把项目文件夹下的package文件删除,再重新生成项目,就会自动从nuget上下载了.
- Electron 初识-搭建一个简易桌面应用
Electron 快速入门 简介 Electron 可以让你使用纯 JavaScript 调用丰富的原生 APIs 来创造桌面应用.你可以把它看作是专注于桌面应用而不是 web 服务器的,io.j ...
- mssql 手工注入流程小结
对于MSSQL的注入点,无外乎这三种权限:SA,DB_OENER,PUBLIC.SA(System Admin)权限我们可以直接执行命令,DB_OENER权限的话,我们可以找到WEB的路径,然后用备份 ...
- MySQL 树形索引结构 B树 B+树
MySQL 树形索引结构 B树 B+树 如何评估适合索引的数据结构 索引的本质是一种数据结构 内存只是临时存储,容量有限且容易丢失数据.因此我们需要将数据放在硬盘上. 在硬盘上进行查询时也就产生了 ...
- Linux常用命令-文件传输类
bye 功能说明:中断FTP连线并结束程序 语 法:bye 补充说明:在FTP模式下,输入bye即可中断正在执行的连线作业,并且结束FTP的执行 ftp(file transfer protocol) ...
- 题解:2018级算法第六次上机 C6-不Nan的过河
题目描述: 样例: 实现解释: 一道因为没排序做了一个小时没做出来的二分答案模板题(手动呲牙) 知识点: 二分答案,最大值最小化 坑点: 排序,judge(mid)函数内计数的实现 其实从最长一步的最 ...
- 数据可视化基础专题(十二):Matplotlib 基础(四)常用图表(二)气泡图、堆叠图、雷达图、饼图、
1 气泡图 气泡图和上面的散点图非常类似,只是点的大小不一样,而且是通过参数 s 来进行控制的,多的不说,还是看个示例: 例子一: import matplotlib.pyplot as plt im ...