本文是Ionic3系列的第一排你文章，主要介绍开发环境的搭建过程，之后的文章将依赖此应用，不再涉及到环境搭建方面的内容(除非是添加特性)，Ionic官方文档： ionic官网 ionic官方文档 本项目...github地址： github 地址 ionic打包成Android应用的详细教程，请参考参考以下链接： ionic3 Android打包 环境准备 node：8.x npm：5.x ionic:...3.x Angular：4.x Cordova：7.x 工具准备 安装Node node下载 下载完成之后：解压 》 配置环境遍历 》 测试 node自带npm，node安装成功，npm也就安装成功...cli可供使用，通过 ionic cli，可以非常方便的创建一个ionic项目。...对应的，还可以使用创建没有模板的应用： ionic start inStart blank 该命令会创建一个基于ionic 最新版本的应用 高本版的ionic cli还有很多非常好用的功能，比如 ionic
var tabs = document.getElementsByClassName('tabbar').item(0); tabs['style'].display = 'flex'; } ionic...创建页面 ionic g page newPage ionic 跳转懒加载页面 原跳转方式 this.navCtrl.push(LoginPage) 懒加载跳转方式 this.navCtrl.push...('LoginPage') ionic 跳转页面loading加载 封装 编写插件，代码如下： import { Injectable } from "@angular/core" import { LoadingController...} from "ionic-angular" @Injectable() export class LoadingProvider { constructor( public loadingCtrl
在ionic CLI v4.8.0版本创建项目时，会询问是创建ionic3还是ionic4项目，然而更新到 ionic CLI v4.10.2(latest)时，这个询问提示消失了，直接默认创建ionic3...项目，而且看参数是没有创建ionic3项目支持的，于是，我上Github发了个issue： How to create ionic3 project by ionic CLI v4.10.2(latest...) 结果ionic团队还是挺给力的，马上作出回复，并一天就解决并发布了新版本，详情进上面链接看。...所以我们想创建ionic3项目可以这样做，先升级ionic-cli到最新版本： npm i -g ionic 此时显示版本为ionic@4.10.3了，然后试着创建项目： ionic start tabTest...--type=ionic-angular 命令完成后就发现是ionic3项目了。
web.postman.co/ signin 補足：送信button：报错 无Agent 时、按照画面指示，下载 postman agent 、双击即可图片２，create workspace图片３，...送信url 配置① API key图片② headercontent-type 指定图片③ body 送信参数配置，点击【send】图片4，保存配置 右上角有邀请其他用户【invite】，还可以共享当前
null : {password: {info: '这是自定义校验函数检查出来的错误'}}; } 为了查看测试结果，需要修改一下模板文件 login.html
所谓的Anrdoid打包，就是将ionic项目打包成一个可以安装在Android系统上的apk文件，打包的时候，使用的是cordova工具，不过在此之前，需要一些准备工作：配置JDK、Android...SDk还有各个android版本包的下载，最重要的是需要成功的创建了一个Ionic项目，有关ionic项目创建的详细教程，请参考以下文章： Ionic3 Start 配置JDK 主要就是以下流程...添加IOS平台需要在MacOS上操作，本文也仅是介绍将ionic项目打包成Android应用，因此不涉及到打包IOS的内容。...执行该命令之后，可以在应用的根目录看到一个新建的文件夹：platform 这个过程中可能会遇到一些问题，不需要轻言放弃，仔细观察错误信息 打包 同样利用cordova工具进行打包。...有关于Android 模拟器调试和真机调试的具体教程，请参考以下文章： Ionic3 Android 调试
但ionic的导航系统使用起来感觉不是这样的，或许原理是类似的吧，但这里只讨论ionic中导航的使用。本文将通过一个例子，讲解ionic中导航的使用。...而对于界面的跳转，Ionic提供了一套自己的API，最常用的就是NavController，这个类中几乎包含了与导航有关的所有方法，通过这个接口可以满足绝大部分需求。...总的来说就是： 是界面的容器，然后通过NavController提供的API实现界面的跳转，从而实现导航效果。 ?... //代码只有一行，其中 root 是 中的一个属性指令，它的值是对应的一个 组件，但是 ionic3中支持懒加载...：' + error); this.nativeService.hideLoading(); this.nativeService.showToast('用户名或密码错误');
image.png 以下是在命令行下，ionic 安卓app签名步骤 准备工作 keytool：该工具位于jdk安装路径的bin目录下； jarsigner：该工具位于jdk安装路径的bin目录下...在开发ionix项目是，使用默认命令(ionic cordova build android)打包出来的是debug apk文件。...要打包 release 版本的apk文件，只需要在后面加一个 --release 参数即可： ionic cordova build android --release 执行该命令后，会在 ionic
本文主要介绍将Ionic项目打包成安卓应用之后的调试过程，调试方式分两种：模拟器调试、真机调试。...不过在此之前，必须要将ionic项目成功打包成Android应用，有关 ionic打包成Android应用的具体教程，请参考以下文章： Ionic3 Android打包 模拟器调试 模拟器调试也就是启动...chrome最新版本打开以下链接：chrome://inspect/#devices 如图所示，保持选项和图上的一致就可以了 image01.png ionic
极光推送 官网：https://www.jiguang.cn/push 注册账号，创建应用，记录AppKey, 应用包名与ioinic 包名一致（config.xml 下 widget 的id） ionic...plugin add jpush-phonegap-plugin --variable APP_KEY=your_jpush_appkey 安装 npm install --save @jiguang-ionic...import { JPush } from '@jiguang-ionic/jpush'; ... providers: [ ......JPush, ... ] app.component.ts import { JPush } from '@jiguang-ionic/jpush' // 极光推送 constructor
为了方便查看测试结果，需要了解Ionic应用调试的基本方法，有关于Ionic项目Android 调试的详细教程，请参考以下文章：Ionic3 Android调试 源码地址 ?...File API规范，提供了一些列的方法用于用于操作文件、目录。...eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOlsiYXBpLXJlc291cmNlIl0sInVzZXJfbmFtZSI6ImFkbWluIiwic2NvcGUiOlsicmVhZCIsIndyaXRlIiwidHJ1c3QiXSwiZXhwIjoxNTA5MTk2OTcyLCJhdXRob3JpdGllcyI6WyJST0xFX1VTRVIiXSwianRpIjoiOWFmYmIyYWItMzdiYi00MTIyLTg2NDAtY2FmMDc1OTRmOGZkIiwiY2xpZW50X2lkIjoiY2xpZW50MiJ9...error }); } /** * 文件上传 */ upload() { const apiPath = "http://192.168.0.104:9090/api...err); }); } /** * 文件下载 */ download() { const url = "http://192.168.0.104:9090/api
简单介绍自己使用Ionic3开发的过程，涉及到的知识点如下： Angular Ionic Cordova ES6 TypeScript Scss 环境搭建 引用插件 调试 Android...Angular路由的影子，API就看Ionic的API即可。...Ionic ionic3基于Angular4。我们知道Angular可以创建自己的模块、组件、管道、服务等等，Ionic就是干了这么一件事情。...资源整理：https://ionicframework.com/docs/ API太多了，直接看文档就好了。 Cordova Cordova提供JS访问原生设备的一种手段。...资源整理：http://cordova.axuer.com/ 在实际开发中，也就是在需要 使用到摸个插件的时候才去看一下该插件对应的api。
其实，Ionic2和Ionic3的差别不大，而ionic4则变化比较大了，它支持angular、vue、react或其它任意js框架，甚至不使用js框架，它更像一个纯粹UI库。...截止到此文时，ionic4还是beta3版，所以还有不少bug存在，但整个项目下来，感觉也没有特别硬性不能解决的bug，就算有，基本也有替代方案。...不带参数创建的是ionic3项目)： ionic start myApp tabs --type=angular 当然也可以用angular-cli创建普通Angular项目，然后npm添加@ionic...>变为，所以对于ionic4的组件使用，还是建议先上官网了解组件的api，特别留意下xxx-controller的变更，常见的有如下几个： modal-controller popover-controller...变化还是蛮大的，旧的ionic3项目不太适合升级为ionic4，至于还学不学得动，自己考量吧，我觉得用vue+ionic4也是挺好玩的。
免费团队中读写工位为两个 只读工位无上限 在上面可以切换团队和项目 （二）项目管理 一个团队中可以生成多个项目，可以在API Post中新建项目，也可以从Postman中导入项目 二、API...Post 可以根据添加的响应示例，自动提取字段和描述 较为复杂的字段也基本可以成功提取 （五）其他功能 1、锁定 ApiPost接口锁定功能：锁定状态下只有锁定这个接口的人能进修修改编辑，其他协作者只能进行查看和接口发送...2、备份 ApiPost接口备份功能：点击创建备份，接口会被备份到服务器中 ApiPost接口还原功能：点击还原可以查看备份的接口，点击还原接口就会被还原成备份的接口 3、接口状态 可以将接口标记为 开发中...三、分享 创建分享链接 设置密码和有效期 生成的文档也比较全面和整洁 四、流程测试 五、笔记 可以用来记录接口相关的工作 六、总结 以上是对Api Post使用的一个简单汇总，该软件还有更多的功能...除此之外 ApiPost 还有更多更好的功能，大家可以登陆官方网站下载体验： Apipost-基于协作，不止于API文档、调试、Mock
本文前提认为读者有基本的angular2基础，知道怎么import，知道provider怎么用 有人问到视频上传这个问题，那我还是写一下吧，其实基本参考《ionic3多文件上传》这文章也行，不过对于单文件上传就不用那么复杂了...DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">... POST...image.png 3、安装相应的Cordova插件 1)这里使用fileTransfer上传方式，所以安装fileTransfer插件及相应的ionic-native模块： ionic cordova...Handle error errorCallback(err); }); } } 关于camera插件参数看github文档，其中特别注意mediaType的值，1为视频 5、在ionic3
image.png 安装插件 ionic cordova plugin add de.appplant.cordova.plugin.local-notification npm install...--save @ionic-native/local-notifications 安装之后，在app.module.ts中引入provider import { LocalNotifications...} from '@ionic-native/local-notifications'; ?
一个祖传老代码打包，提示如下错误： ReferenceError: webpackJsonp is not defined at http://localhost:8100/build/main.js...:1:1 一搜发现应该是使用了新版本的Ionic-App-Scripts导致的： This is a breaking change in Ionic-App-Scripts https://github.com.../ionic-team/ionic-app-scripts/releases/tag/v2.0.0 src/index.html must be modified to include a new vendor...-- Ionic's root component and where the app will load --> <script src="cordova.js
手势Gestures，ionic官网上的文档描述非常简单，就下面一段就没了，估计很多人看完直接就懵了：只有6个事件吗？ ?...手势.png 我粗略搜索了ionic关于手势事件的文章，像pressup等内容的，居然没有，orz……ionic常常使用流行的库来补充自身，像slide组件就是封装了swiper，而手势是使用了另一个有名的库...所以我们通过了解HammerJS就可以知道ionic3的手势事件——其实是6种，我简单列一下分类及其下事件： 一、pan——平移 ? pan.png 最小平移距离为10px，才会识别为pan....tap.png 多次tap间隔为300ms，用以区分是不是双击或其它，最大按下时间为250ms，用以区分press或其它 tap 上述事件在ionic中普通使用即可，具体事件参数通过$event获取
npm install --save @ionic-native/streaming-media 其次在app.module.ts文件中的providers里添加StreamingMedia。...一般会添加下面两属性允许局部播放： 为了少摸索折腾，可以使用第三方js，如video.js和jplayer.js，对于ionic3...[](assets/imgs/eagle.jpg) 标题 3>描述3> 其中#myMedia为必须的，提供给[vgMedia]，但名字可任意，表示创建一个作用域内的临时变量用示标识并操作同级组件...视频滚出可视区域，应停止播放； 当前视频点击播放，其它视频应该全部停止； 全屏播放完成应退出全屏； 播放时应自动隐藏播放控件，点击屏幕时显示播放控件； …… 这些部分可配合videogular2的API
进行HttpClient post参数错误 从“Windows.Web.Http.HttpStringContent”转换为“System.Net.Http.HttpContent” 原因 用了System.Net.Http.HttpClient...其实HttpStringContent是可以在错误看到，不是System.Net.Http 方法 使用 Windows.Web.Http.HttpClient webHttpClient
云服务器
ICP备案
云直播
即时通信 IM
实时音视频
