这是在学习ionic时,当时遇到的一些问题,觉得很难,就记笔记下来了,现在觉得如果可以拿来分享,有可能会帮助到遇到同样问题的人

ionic slidemenu

项目流程:

cd pretices(自己创建的文件夹名称)

ionic start oneApp blank(创建一个空项目)

在WWW文件夹下创建templates,controllers 文件夹

1、创建slidemenu方法

index 页面

<ion-nav-view></ion-nav-view>

在app.js里面添加

app.config(function ($stateProvider, $urlRouterProvider) {

    $stateProvider

        .state('app', {

            url: "/app",

            templateUrl: "templates/menu.html",

            controller: 'appCtrl'

        });

    $urlRouterProvider.otherwise('/app');

});

  

这里是ionic路由配置问题,如果看不太懂,可以到ionic官网里面找到并学习,不得不说官网上面有很多值得学习的知识

2、在app.js里添加控制器名,在index里引用已添加的控制器名,在controllers文件夹里添加相应的控制器

3、controllers文件夹里添加相应的控制器:

var module = angular.module('app.appCtrl', []);

module.controller('appCtrl', function () {

});

4、

在HTML页面里面写:

ion-side-menus等,最后在button 加menu-toggle=“left”,侧边栏就出来了

注:博客会持续更新,欢迎大家提问、评价、更改。更多技术分享www.ncloud.hk

ionic 项目中创建侧边栏的具体流程分4步简单学会的更多相关文章

  1. ionic 项目中添加modal的步骤流程

    1.首先在templates文件夹下面定义一个新页面,xxx.html,template文件夹在空项目里面是没有的,需要手动添加一个,放在WWW文件夹下面. <ion-modal-view> ...

  2. Ionic项目中使用极光推送

    Ionic项目中使用极光推送-android   对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档) ...

  3. Ionic项目中使用极光推送-android

    对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档),使用的是GitHub上的 PushPlugin ...

  4. Ionic项目中如何使用Native Camera

    本文介绍如何在ionic项目中使用设备的camera. Ionic版本:v3.2.0 / 2017-05-10 / MIT Licensed / Release Notes ============= ...

  5. Asp.net MVC 4新项目中创建area的后续操作

    Asp.net MVC 4新项目中创建area后,往往HomeController与area的HomeController路由发生混淆,需要手工设置一些地方避免mvc无法识别默认路由的状况. 无废话具 ...

  6. Web项目中创建简单的错误处理页面

    当应用程序出现错误的时候,如果没有做错误页面处理的话,会直接输出一些敏感的信息出来,有时候甚至会直接将项目所在的物理路径给显示出来,严重缺乏安全性,并且错误种类繁多,页面风格不一,导致用户体验不好,本 ...

  7. Ionic 2 中创建一个照片倾斜浏览组件

    内容简介 今天介绍一个新的UI元素,就是当我们改变设备的方向时,我们可以看到照片的不同部分,有一种身临其境的感觉,类似于360全景视图在移动设备上的应用. 倾斜照片浏览 Ionic 2 实例开发 新增 ...

  8. ionic 项目中使用ngCordova插件$cordovaCamera筛选手机图库图片显示出来并上传

    原文档请看http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/ionic%E5%9B%BE%E7%89%87%E4%B8%8A%E4%B ...

  9. php 从2维数组组合为四维数组分析(项目中前台侧边栏导航三级分类显示)

    foreach函数(循环函数)内嵌套循环函数时,当内层完全循环完后,才会向上一级循环 数组要注意问题 array_merge----合并一个或多个数组 将一个或多个数组的单元合并起来,一个数组中的值附 ...

随机推荐

  1. 源于《Unity官方实例教程 “Space Shooter”》思路分析及相应扩展

    教程来源于:Unity官方实例教程 Space Shooter(一)-(五)       http://www.jianshu.com/p/8cc3a2109d3b 一.经验总结 教程中步骤清晰,并且 ...

  2. java.util.prefs.Preferences

    java.util.prefs.Preferences Preferences类是在JDK1.4中首次提供的,可以用它来存放应用程序的配置数据,这里对Preferences类做点介绍. 1.Prefe ...

  3. Linux常用快捷按键

    Linux常用快捷按键 为了提高工作效率 1 一定用快捷键 这里简单的说下几个常用的快捷按键. Ctrl + l    清屏,相当于clear命令. Ctrl + z    挂起,程序放到后台,程序没 ...

  4. 跨交换机相同vlan内的通信(trunk模式)

    当一个公司的小型局域网内部,处于不同楼层的主机处在同一个虚拟局域网内,连接到不同的交换机上,这时候就需要相同虚拟局域网内部的主机进行跨交换机进行通信. 通过设置交换机之间相连接的端口开启trunk模式 ...

  5. 更新jar包里的配置文件

    更新jar包里的配置文件 起因 从笔记本传了个jar到服务器,运行的时候才发现配置文件一个ip项填错了.本来很简单的问题,maven重新打包就可以了,但是30多M的jar包就因为一个配置项错了又要重新 ...

  6. 区划代码 node 版爬虫尝试

    前言 对于区划代码数据,很多人都不会陌生,大多公司数据库都会维护一份区划代码,包含省市区等数据.区划信息跟用户信息息息相关,往往由于历史原因很多数据都是比较老的数据,且不会轻易更改.网上也有很多人提供 ...

  7. ZooKeeper实践:(2)集群管理

    前言: 随着业务的扩大,用户的增多,访问量的增加,单机模式已经不能支撑,从而出现了从单机模式->垂直应用模式->集群模式,集群模式诞生了,伴随着一堆问题也油然而生,Master怎么选举,机 ...

  8. 详谈JAVA中的file类与IO流

    File类 位置于java.io包构造方法:File(String parent, String child)new file("d:\\","a.txt") ...

  9. 新鲜小玩意儿- deviceOrientation移动设备旋转事件

    <javascript高级程序设计>第三版 其中事件的章节 提到一个有意思的事件 deviceOrientation 也就是 设备(device) - orientation(方向) 贴代 ...

  10. Eclipse中如何关联Javadoc

    MySQL重置密码:http://www.jb51.net/article/35061.htm Eclipse有直接查看java文档和类库源码的功能,不过得手工添加才行,下面对如何在Eclipse中添 ...