Ionic1与Ionic2
1、Ionic2新特性
①组织结构与框架:
在Ionic2中,每个组件、页面都只专注于做一件事,它单独有自己的一个目录,有自己的类(Class)、模板文件(Template)和自己的样式文件(在这里我们提倡使用scss);
②命令行工具:
在开发中,我们总希望能够有一个规范使得我们的开发更具有合理性,同时还能提升我们的开发效率,那么ionic2的CLI完全可以满足你这一点。
③路由导航:
Ionic2的路由导航不同于Ionic1,我们都知道其实Anngular1自带理由是比较弱的,在复杂路由跳转的app中,是很吃力的,我 们一般都是依赖Angular1的插件ui-router,它是基于URL的hash(当然官方也提供配置切换到html5模式),那么ionic1也是 在这个基础之上进行导航封装的,比如说页面导航堆栈。
④模板的语法结构:
ionic2的模板语法与Ionic1非常相似,但是看起来又有点古怪,其实Ionic2的模板语法更为简洁。例如:
- ionic1:
<img ng-src="{{photo.image}}" />
- ionic2:
<img [src]="photo.image" />
我们看一下 事件调用:
- ionic1:
<button ng-click="doSomething()">
- ionic2:
<button (click)="doSomething()">
⑤编译:
ionic从平台上讲是基于cordova的封装( 不仅仅是它的CLI
),因此ionic工程也是一个标准的cordova工程,也就是说我们最终给跨平台提供的是www目录的资源文件,但是在ionic2中我们都是在 www的同级目录的app目录进行编码,也是因为我们使用EM6或Typescript写的代码浏览器并不能够直接执行,如果你自己观察ionic2的工 程目录,你会发现Gulp.js的脚本多了几个任务的定义,其实是几个ionic的钩子命令,如ionic
serve,ionic build之类的,其目的是在我们打包,或者浏览器模拟时的
命令执行之前,执行一些gulp任务,其中就是对typescript、scss的编译,是不是感觉很方便,而且最终合并编译到www/build/js目录下,并且很难反编译,也就是说你的app如果被人解包,他只能运行,但如果想拿到你的源码是相当困难的。
Ionic1与Ionic2的更多相关文章
- ionic3懒加载IonicPage使用报错
ionic3.X版本有不少亮点.作为从angular1到ionic1.ionic2一直用它们开发单页面应用的使用者来说,一直存在的一个痛点就是,将整个项目作为网页不打包成app的话,第一次加载时间太长 ...
- Ionic2优于Ionic1的6个理由
经历了一个从0到有的app的开发,我已经很熟悉Ionic1了,在此期间我曾发现过Ionic1的一些bug,和一些不合理的地方(根基版本 不同,后续我会陆续发表这些文章),我甚至在此期间对Ionic1进 ...
- ionic2+angular2中踩的那些坑
好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章,但自己还没摸清门道,本来也是感兴趣就学习了 ...
- ionic2+angular2
ionic2+angular2中踩的那些坑 好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章 ...
- 认识ionic2
1. Ionic 2 介绍 Ionic 2专注于以标准的HTML.CSS和JavaScript来构建移动站点,并可以通过Cordova打包成移动 App,只需编写一次代码,就可以分别部署到iOS.An ...
- IONIC2新建项目并添加导航
一. 基础搭建 1. 新建IONIC2项目 ionic start myApp tabs --v2 不加--v2会新建ionic1的项目 2. 运行项目 cd myApp io ...
- ionic2新手入门整理,搭建环境,创建demo,打包apk,热更新,优化启动慢等避坑详解
onic官方文档链接:http://ionicframework.com/docs/ 如果是新的环境会有很多坑,主要是有墙,请仔细阅读每个步骤 文档包含以下内容: l 环境搭建 l 创建demo并 ...
- ionic2简单分析
Angular2是一个全新的框架,它从ReactJS以及其他web移动框架借鉴了不少经验和优点,巨大的改进使得开 发体验和性能已经超越了Angular1,而且Ionic2无论是从UI交互效果和跨平台的 ...
- ionic1页面切换动画卡顿优化
https://github.com/shprink/ionic-native-transitions https://www.npmjs.com/package/ionic-native-trans ...
随机推荐
- 分布式系统中的CAP原理和BASE理论
CAP是一致性(Consistency).可用性(Availability).分区容忍性(Partition tolerance)的缩写.CAP原理指的是这三个要素最多只能同时实现两点,不可能三者兼顾 ...
- uva12264 Risk
最小值最大,就二分判断. map[i] = '0'+map[i];这样更方便 每个点拆成i,i’, S连i,cap为a[i],i’连T,cap为1(保证至少剩一个)或mid. i,i’ ,a[i] ...
- const、let、var的区别
const不能从字面上来理解,他不能修改的是栈内存在的值和地址. 使用const声明的是常量,在后面出现的代码中不能再修改该常量的值. 怎么理解栈内存在的值和地址呢?就要从javascript的类型说 ...
- Springboot邮箱接口(使用个人邮箱发送邮件)
近期项目使用邮件验证,这里使用个人邮箱进行测试,记录开发笔记 SpringBoot自带短信接口 maven pom.xml 引入: <dependency> <groupId> ...
- 【dp】拔河比赛
01背包:感谢ZCK大佬 题目描述 学校举行拔河比赛,所有的人被分成了两组,每个人必须(且只能够)在其中的一组,要求两个组的人数相差不能超过1,且两个组内的所有人体重加起来尽可能地接近. 输入 输入中 ...
- ubuntu命令行卸载并清理软件
卸载软件,可以使用下面这两种方式之一: sudo apt-get remove --purge [software name] sudo apt-get autoremove --purge [sof ...
- 微信小程序 wx.request POST请求------中文乱码问题
问题: 一个简单的表单,提交后台返回数据“提交成功”. 以为没问题了,但是没过多久后台小哥就问为啥那么多乱码,找了很久原因,发现在提交的时候就已经乱码了. 嗯,前端问题,然后测试GET/POST方法. ...
- 主DNS服务-反向解析
上篇说了主DNS正向解析 当中是有个小问题的,什么问题呢? 试问当我们输入wwww或ww或更多w的时候它还能解析出来吗? 或者不输入w的时候还能解析吗? 上篇没有定义是解析不了的,怎么定义呢?很简单, ...
- GIMP选择区域Selection Editor
如图我要选择该图的衣服部分和这个球的部分, 选择Select下的Selection Editor工具,然后点击魔法棒工具(Fuzzy Select Tool),选择衣服: 需要注意以下白色部分是选择的 ...
- jQuery和Vue
jQuery 概述 是js的一种函数库有美国人 John Resig编写 特点 写的少,做的多,国内用的jq1.0版本,可以兼容低版本的浏览器,支持链式编程或链式调用和隐式迭代 链式编程 $(this ...