ionic 简单的使用
来源:互联网 发布:java小游戏开发实例 编辑:程序博客网 时间:2024/06/06 02:26
//先导入bundle包不能再导入angular包了不然会报错
<script src="js/ionic.bundle.min.js" type="text/javascript" charset="utf-8"></script>
//简单的一个小案例
<body ng-app="myApp" ng-controller="myCtrl">
//设置一个标题
<!--<div class="bar bar-header bar-positive" >
<!--<div class="bar bar-header bar-positive" >
<h1 class="title">bar-light</h1>
</div>-->
<ion-header-bar class="bar-positive">
<h1 class = "title">头部</h1>
</ion-header-bar>
<!--
<ion-header-bar class="bar-positive">
<h1 class = "title">头部</h1>
</ion-header-bar>
<!--
内容
-->
<ion-content>
<ul class="list">
<li class="item">张三</li>
<li class="item">张三</li>
<li class="item">张三</li>
<li class="item">张三</li>
</ul>
<input class="button button-balanced" type="button" value="按钮"/>
</ion-content>
<!--
<ion-content>
<ul class="list">
<li class="item">张三</li>
<li class="item">张三</li>
<li class="item">张三</li>
<li class="item">张三</li>
</ul>
<input class="button button-balanced" type="button" value="按钮"/>
</ion-content>
<!--
底部
-->
//设置底部
<ion-footer-bar class="bar-assertive">
<h1 class="title">我是底部</h1>
</ion-footer-bar>
<!--js开始-->
<script type="text/javascript">
var mo = angular.module("myApp", ["ionic"]);
mo.controller("myCtrl", function($scope) {
})
</script>
<!-----------------------js结束----------------------------------------->
</body>
<ion-footer-bar class="bar-assertive">
<h1 class="title">我是底部</h1>
</ion-footer-bar>
<!--js开始-->
<script type="text/javascript">
var mo = angular.module("myApp", ["ionic"]);
mo.controller("myCtrl", function($scope) {
})
</script>
<!-----------------------js结束----------------------------------------->
</body>
阅读全文
0 0
- ionic 简单的使用
- Ionic中单选按钮radio的简单使用
- ionic简单的布局
- Ionic Datepicker的使用
- IONIC插件的使用
- ionic providers的使用
- Ionic教程-modal的使用
- IONIC 表单标签的使用
- ionic的安装及简单的应用
- Cordova+Angularjs+Ionic混合开发入门篇(四)—— 插件的简单使用
- ionic的样式布局简单入门
- Ionic创建一个简单的APP
- 【ionic】做一个简单的 card功能
- Ionic 侧边栏菜单的简单实现
- ionic简单的选项卡操作
- ionic 简单的 头部 内容 脚步 添加
- ionic使用
- Ionic使用
- ionic选项卡操作
- Android 弹幕的实现DanmakuFlameMaster
- hive数据的加载与导出
- Spring实例化bean
- Lua(—)
- ionic 简单的使用
- 为C++编写图形化的调试可视化工具(Writing graphical debugger visualizers for C++)
- UVa1590 找最小子网掩码,和子网ip
- java jsp 执行过程
- Android ndk获取手机内部存储卡的根目录
- Python操作MySQL数据库
- demon15
- 2017年度总结-2018总体规划
- 哈希学习代码