ionic初体验
source link: https://zhuanlan.zhihu.com/p/42382106
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
ionic初体验
上周末花了几乎一整天学习了目前比较火的跨平台的移动端编程框架ionic. 写了 一个极简的reddit客户端-加载订阅的reddit看板,加载当前gps所在的天气,可以添加/删除看板,不支持搜索看板. 最大的问题是被js里面的Promise和Observable搞死了. 没想到异步编程花样这么多.
简单说下我遇到的问题. 在reddit中有看板(subreddit)这个概念, 例如, programming看板是和编程相关的post. 用户可以订阅看板, 如果你知道看板名称,那么可以通过http://www.reddit.com/r/programming访问该看板的内容. 我的思路是service应该和view层分开,分别对应reddit.service.ts和home.ts的代码. 在reddit.service的loadPosts方法中应该先去数据库获取用户订阅的看板列表,然后在利用angular的http方法请求这些看板最热的15条post返回给view层:
//reddit.service.ts
loadPosts() {
return this.getCurrentSubs().then(data => {
return this.getPosts(data, 10);
});
}
//getCurrentSubs从数据库获取用户订阅的看板
//getPosts使用http请求所有看板的热门post
可是因为ionic的Storage数据库get()返回是Promise, 而angular的http返回值却是Observable,这样最后得到的是一个Promise<Observable<any[]>>对象. 在home.ts中使用这个service方法:
//home.ts
//加载reddits posts
loadPosts() {
this.redditService.loadPosts().then(ob => {
ob.subscribe(responses => {
responses.forEach(res => {
res.data.children.map(item => this.posts.push(item));
this.posts.sort((a, b) => {
return b.data.num_comments - a.data.num_comments;
});
});
});
});
}
简直非常丑陋有没有? 有没有?先then然后又subscribe有点辣眼睛. 希望哪位懂js的指点一下,我感觉我的写法是有问题的.
代码放在github,使用方法在readme里面:
stackoverflow关于Promise和Observable的讨论:
https://stackoverflow.com/questions/37364973/promise-vs-observablestackoverflow.com关于ionic的体验
不得不说ionic的使用体验还是不错的,如果只是简单的内容app,使用ionic应该基本能满足功能需求,而且上手非常快, 作为Java程序员, 上手angular应该一两天就够了. 根据同事的说法,ionic的坑还是有的,主要还是cordova问题,很多要么就是在苹果手机出现,要么在android手机出现. 他做的也是一个内容app,在很多app效果上容易踩坑.
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK