![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Ionic+AngularJs
ionic集成angularJs
AndrewWen099
闻道有先后,术业有专攻。
展开
-
Ionic 4 框架下 openfire接收到消息刷新列表白屏问题
如下图所示:im通过userId登录im系统正常,进入聊天详情页面能正常聊天,收发消息都ok,但是当用户在邀约列表页面获取邀约列表信息的时候,收到消息页面刷了两下就白屏了,使用元素查看器查看列表发现消息有数据,但是没有看到值,于是调试onconnection方法,打了断点,始终没有找到问题的原因,最后只要用排除法一个function一个function的注释,然后调试,原来是系统使用了setInterval()导致更新视图的时候interrupt了,解决办法就是 优化setInterval()。.原创 2021-08-24 11:32:02 · 256 阅读 · 0 评论 -
ionic4 + angularJs 打包使用 Gzipper 压缩 注意不要压缩图片
因为项目使用的框架是angularJs +ionic4 自带的混淆命令为 ng build --prod其中图片和css样式没有压缩 ,所以添加 gzipper进行压缩:首先需要安装gzippernpm i gzipper如果angular.json中的configurations配置好了如下"configurations": { "production": { "fileReplacements": [ .原创 2020-10-23 10:29:12 · 516 阅读 · 0 评论 -
ionic我的收藏可以滑动的嵌套segament
顶部住房,商铺 用segament控件,里面又嵌套了一层原创 2020-12-07 16:34:28 · 170 阅读 · 0 评论 -
angularJs框架结合ionic4 框架下 需要分两行一行显示2个字共四个字的信息,例如 更多信息 这四个字。
angularJs框架结合ionic4 框架下 需要分两行一行显示2个字共四个字的信息, 例如 更多信息 这四个字。1.使用ionic 栅栏组件 <ion-grid> <ion-row> <ion-col> <div>更</div> </ion-col> <ion-col> <div&g原创 2020-10-23 10:09:53 · 365 阅读 · 0 评论 -
从page页面接口获取标签思考if与if else使用场景
前提:page页面接口获取多个标签,如果需要在改页面只能添加一种类型就用 if(){}else if(){}如果要添加多种则可以用if分代码块处理举个例子:当前页面 既有homeAppTabTag 又有 imagesTag就用 分段if ,如果业务只需要用一个ta就用 if(){}else if(){} // 先清空 头部标题以及 标题栏 view this.coms = null; this.tabsService.getPageDat原创 2020-12-08 09:41:34 · 216 阅读 · 0 评论 -
解决 Cannot find name ‘$‘
ERROR in src/app/coms/simple-icon-tips-tag/simple-icon-tips-tag.component.ts(17,5): error TS2581: Cannot find name '$'. Do you need to install type definitions for jQuery? Try `npm i @types/jquery` and then add `jquery` to the types field in your tsconfig.原创 2020-11-30 16:31:02 · 3462 阅读 · 0 评论 -
vscode新增用户代码块
vscode 文件 -> 首选项 -> 用户片段点击新代码片段{ // Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and // description. Add comma separated ids of the languages where the snippet is applicable in the sc原创 2020-11-18 16:58:03 · 269 阅读 · 0 评论 -
事半功倍之Ionic APP通过scss全局文件换皮肤,typescript中component.ts文件获取scss文件中定义的全局变量
typescript中component.ts文件获取scss文件中定义的变量原创 2020-11-16 12:47:38 · 493 阅读 · 0 评论 -
angularJs 自定义动画 用于安卓模拟ios转场动画
const DURATION = 550;const EASING = 'cubic-bezier(0.33,0.33,0.36,1)'; // cubic-bezier(0.36,0.66,0.04,1)const OPACITY = 'opacity';const TRANSFORM = 'transform';const TRANSLATEX = 'translateX';const CENTER = '0%';const OFF_OPACITY = 0.5; // 0.8export.原创 2020-10-30 12:01:19 · 146 阅读 · 0 评论 -
ionic + angularJs 比真机打包更快的验证运行效果的方法
1.准备一台iphone 6。2.使用wifi 内网外网都可以测试 生成一个访问地址。3.iphone手机上通过qq访问该链接地址即可。原创 2020-10-30 10:06:04 · 103 阅读 · 0 评论 -
ionic+angularJs 版本提示更新安全的处理方式
为防止出现字符串比较不准确的情况例如3.1.10与3.2.1 通过字符串比较是3.1.10为大,所以为了避免这种情况发生采用逐个字符比较的方式比较。如下面代码所示:this.appVersion.getVersionNumber().then((value: any) => { this.http.get(jsonUrl + new Date().getTime(), (res) => { const versionTxt =原创 2020-10-29 17:59:33 · 153 阅读 · 0 评论 -
angularJs 7 集成 jQuery js库
1.首先使用npm命令安装jQuerynpm install jQuery2.然后在index.html 引入jquery文件<!-- 可以使用本地文件 --> <script type="text/javascript" src="assets/js/jquery.min.js"></script>3.在要用到的components组件中使用:import { Component, OnInit, Input } from '@angula原创 2020-10-29 17:02:37 · 144 阅读 · 0 评论 -
ionic4 + angularJs 7 监听ionsearchBar控件
我们在使用搜索栏搜索信息的时候,需要监听控件失去焦点或者获取焦点的事件,刚好项目里面使用到了这个ion-searchbar控件现在分享下使用经验:ion-searchbar一般放在头部:例如:<ion-header> <ion-toolbar> <ion-buttons slot="start" *ngIf="showIcon"> <ion-button (click)="doDiss()">原创 2020-10-29 16:14:42 · 290 阅读 · 0 评论 -
TypeScript 删除js数组元素:
使用splice函数://只退出当前窗口的imsidletsid=localStorage.getItem('chatImSid');if(window['chatImSid']){sid=window['chatImSid'];}if(localStorage.getItem('chatImSidArray')){constoriginalArry=localStorage.getIte...原创 2020-10-29 15:41:29 · 919 阅读 · 1 评论 -
vscode 新建代码块
{ // Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and // description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope // is left empty or.原创 2020-11-26 17:25:23 · 119 阅读 · 0 评论 -
ionic app 解决 chrome浏览器中 H5 页面因为margin导致modal弹窗靠右显示。
chrome浏览器使用margin:auto1.7rem;会导致modal向右边靠拢。ionic 4 + angularJs 。解决办法就是 去掉 margin的auto。原创 2020-11-25 21:44:34 · 250 阅读 · 0 评论 -
来荐App 多选适合经营侧边栏的实现方式。
前提,项目需要实现一个和京东app 点击底部分类tab切换 推荐分类 控件,例如点击左边男装,返回了男装馆,潮流发现,品质大牌。原创 2020-11-22 12:23:56 · 174 阅读 · 0 评论 -
解决 ionic 自定义弹出窗口 配置指定div可以滑动
最近项目中用到了modal弹窗但是弹出的modal数据量比较大的时候无法滑动解决办法如下:代码如下:.mybicon-modal { background: 0 0; width: 100%; overflow-y: scroll !important; height: 90%; margin-top: 10%; position: relative; display: flex;}...原创 2020-11-19 14:06:51 · 308 阅读 · 0 评论 -
css兼容性样式判断如果是苹果手机
ionic app 项目实际开发中经常需要兼容ios和安卓两种手机。转载 2020-11-19 09:53:26 · 1717 阅读 · 0 评论 -
ionic UI 中 ion-list 去除下划线。
ion-list控件中有嵌套ion-item,这个item可以设置是否显示下划线 可以编辑lines=none属性<section> <ion-list> <ion-item *ngFor="let item of surroundingBusiness.data;let i=index;" detail="false" [lines]="none" (click)="closeModel(item);">原创 2020-11-14 17:29:52 · 531 阅读 · 0 评论 -
ionic+angularJs 内嵌video 标签全屏播放视频 点击安卓物理返回键界面展示异常
ionic+angularJs 内嵌video 标签全屏播放视频 点击安卓物理返回键的时候 页面完全变样了,竖屏展示了横屏的内容解决办法如下:修改原生 CordovaWebViewImpl文件 public void hideCustomView() { // TODO fixed by andrew.wen for 播放视屏横屏之后在点击物理返回键会导致展示出错 故先翻转屏幕 if( cordova.getActivity().getRequested原创 2020-11-11 10:31:48 · 415 阅读 · 0 评论 -
ionic+angularJs 内部app需要限制ios手机设备登录处理
业务员用的app需要限制设备登录,安卓手机比较好处理因为只需要拿imei限制就行了,但是ios手机比较麻烦,通过驱动获取的deviceId每一次都不一样,所以需要取钥匙串因为钥匙串是重新安装或者更新苹果系统的时候才会更新的。所以新增了一个绑定钥匙串的插件:ionic cordova plugin add cordova-plugin-keychain-uuid需要先运行 npm i cordova-plugin-keychain-uuid代码如下: document.原创 2020-11-10 12:59:37 · 285 阅读 · 0 评论 -
ionic4 + angularJs 7 实用命令
1.查看Ionic 版本 cordova 信息 公共资源库 以及系统环境的命令:ionic info2.ionic 打包安卓debug,release包ionic cordova run android --prodionic cordova run android --prod --release// 使用build也行ionic cordova build android --prod ionic cordova build android --prod --relea.原创 2020-10-29 16:24:30 · 80 阅读 · 0 评论