一周搞定TypeScript+Angular2+Ionic2
预先说明一点，笔者是后端程序猿，前端只是略懂，仅仅略懂。这篇文章比较长，很多老铁估计一看到滚动条就放弃了，这里我要说的是程序是比较简单的东西，只要你有一定的耐心，肯定会有非凡的收获。只需要你有5成的html+css3+js基础即可开始我们的一周之旅。废话少说，能贴代码绝不瞎比比。
记录每天的各种消费，以控制每月的消费（其实是因为穷，所以要节流）。目前比较简单，只是对业务的实现，没有集成安全认证、断网检测等技术功能，接下来我会尽快实现，毕竟一口吃不了一个大胖子，还有晚上要陪女票，时间紧凑啊。 后端API：SpringBoot+SpringData JPA+ SQlite数据库 前端APP：TypeScript+Angular2+Ionic2 看看最终的效果图，给大家一点往下看的动力： 效果图 代码托管在GitHub上面，强烈建议clone下来，我的代码写的很清晰。然后给个Star哦，你的鼓励是我前进的动力^_^ 服务器：DayBookIonic2 APP：DayBookApp1.TypeScript学习TypeScript是微软推出的编程语言，始于javascript，归于javascript。说白了你用TypeScript写的程序最终还是要编译成javascript。毕竟是要在浏览器运行的，目前市面上浏览器都基于ES5是不支持TypeScript运行的。按照惯例，先学个五成。 //动物父类
class Animal {
name:string;
constructor(theName: string) { this.name = theName; }
move(distanceInMeters: number = 0) {
console.log(`${this.name} moved ${distanceInMeters}m.`);
}
}
//蛇继承动物
class Snake extends Animal {
constructor(name: string) { super(name); }
move(distanceInMeters = 5) {
console.log("Slithering...");
super.move(distanceInMeters);
}
}
//小马也继承动物
class Horse extends Animal {
constructor(name: string) { super(name); }
move(distanceInMeters = 45) {
console.log("Galloping...");
super.move(distanceInMeters);
}
}
let sam = new Snake("Sammy the Python");
let tom: Animal = new Horse("Tommy the Palomino");
sam.move();
tom.move(34);
这就是TypeScript语言五成的知识，有面向对象经验的程序员看一眼乐开花了吧。我是花了大概一天时间在下面这个地方过了一遍，也会遇到很多不明白的地方。我觉的你不是天才的话肯定会也会遇到一些困惑。没事，先记住它的语法，继续一口气往下学。学不下去了再去google 百度。 TypeScript完全学习文档2.Angular2学习以前学过AngularJS，学习曲线确实陡峭。第二代官方去掉JS叫Angular2。不光名字简单了，上手也容易多了。前提是掌握TypeScript，否则就跟我一开始直接看Angular一样，她认识你，你不认识她。英语好的直接看官方文档开始学，英语不好的按着下面的翻译文档过一遍，这个文档做的特别好。首先让你掌握下基础的语法、要点，然后从新建项目引导你到最后做一个Demo。一整套下来也就一两天的时间，Angular的基本知识也就掌握了。如果你没有Angular基础，先不要直接从Demo部分开始看哦，免得被打击。 Angular完全学习文档3.Ionic2学习Ionic基于最新的Angular2，用TypeScript语言进行app开发，并用Cordova打包成App，只需一次编写，就可以分别部署到IOS，Android，WP等系统。 Paste_Image.png 同样详细的文档将帮助你开始你的Ionic2之旅 Ionic2完全学习文档有了前面TypeScript和Angular2打的基础，现在开始Ionic2如有神助的感觉，倍儿爽。 有了一定的学习基础以后，聪明的你肯定跃跃欲试了吧。不要急，你的渴望程度还不够。从GitHub把项目clone下来，本地运行起来，看看效果，再撩拨下你。 服务器：DayBook Ionic2 APP：DayBookApp 项目clone下来后我们一一部署。 1.部署服务端 系统默认启动端口是9971，修改端口可以在src/main/resources/application.properties文件中修改
在项目根目录下直接运行下面的命令
上一步打包后，从命令行进入target/DayBook根目录；执行 2.运行Ionic2 App 修改App中服务起访问地址,src/providers/http-service.ts文件修改API服务器访问地址 修改成功后，运行命令
app签名的意义其实就是给app一个身份证。这样你的app发布到市场，就拥有了唯一的ID。 storeFile=your keystore path keyAlias=your key aliasstore Password=your store passwordkey Password=your key password 然后构建app命令换成
问题汇总浏览器启动app访问时会存在跨域不可访问的问题。这是浏览器的机制决定的。安装到手机不会有这种问题。为了便于我们调试，建议用谷歌浏览器，然后安装跨域插件 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |