芒果·布丁-CSDN博客

原创 ionic3 懒加载

ionic3 懒加载第一步：增加module.ts第二部：去掉app.module.ts中重复的部分第三步：在对应页面的.ts文件里增加@IonicPage()特性(以home.ts为例)第四步：使用懒加载（只需要将之前的页面名字用引号引起来即可，对应的也不需要在顶部进行import导入）app.component.tstabs.ts第五步：懒加载运行效果图首次进入的时候，...

2019-01-18 10:27:07 419 2

原创 angular点击下载文件

home.component.html<button type="button" (click)="download()">下載</button> home.component.tsdownloadFile(data: any, type: number, name: string) { const blob = new Blob([da...

2018-11-29 12:29:44 3525

原创 angular4.x 数据循环

数据循环*ngFor 普通循环 eg: *ngFor="let item of listArray" template 循环数据 eg：template="ngFor let item of listArray"home.component.tspublic:list=[];public:list3:any[];constructor(){this.list=['数学','...

2018-11-28 16:52:46 819 1

原创 angular4.x:搭建angular开发环境

1.安装node.js. Node.js官方网站2.接着安装Typescript. npm install -g typescript3.安装angular-cli.npm install -g @angular/cli4.新建一个项目。ng new xxxx============================angular常见的命令新建一个项目：ng new XX...

2018-11-27 14:39:36 296

原创 browser发布去掉screen

config.xml<platform name="browser"><preference name="ShowSplashScreen" value="false" /></platform>

2018-11-26 09:35:02 142

原创 Ionic3 自定义tabs菜单图标

tabs.scss .ion-tab-icon-base { width: 30px !important; height: 30px !important; } .ion-tab-icon-md-base { min-width: 0 !important; height: 30px; } ...

2018-11-22 14:37:24 482 4

原创 Ionic 【tabs模板】详情页刷新以后，页面数据不消失，点击返回按钮可回到首页

1.详情页刷新，确保当前页面数据不丢失首先假设首页（home）跳转到 home-details,传递参数code: //home.tsthis.navCtrl.push(HomeDetailsPage,{ code:code}) 然后再home-details.ts中获取传过来的参数： //home-details.tsthis.id = this.navPa...

2018-11-09 11:42:51 692

原创 ionic自动生成应用图标和启动页

一.素材准备icon.png 尺寸192*192（最好是1024*1024） splash.png 尺寸2208*2208二.替换图片用做好的应用图标和启动页替换掉在resources下面的icon和splash,注意文件命名得跟那两个一样三.执行命令 1.可以直接命令：ionic resources 2.也可以单独生成： ...

2018-11-06 17:34:44 247

原创 Ionic在应用程序启动前读取应用程序启动之前的配置文件，避免代码频繁编译

1.app.module.ts2.app.config.ts1.新建app.config.ts文件2.内容:app.config.ts获取地址import { Inject, Injectable } from '@angular/core';import { Http } from '@angular/http';import { Observable } from 'rxjs/R...

2018-10-30 16:07:26 379

原创 Ionic页面传参跳转

一.ionic通过click传参跳转添加click事件&lt;button (click)="goNews('newsId')"&gt;&lt;/button&gt;引入页面定义数据import { NewsPage } from ‘…/pages/news/news’; goNews(value:string){ this.navCtrl.push('GoodsDe...

2018-10-24 10:40:11 524 1

原创 Ionic创建页面和跳转

1.创建页面：ionic g page news2.<button (click)="goNews()"></button>3.news.ts import { NewsPage } from '../pages/news/news'; goNews(){ this.navCtrl.push(NewsPage ) }

2018-10-24 10:10:39 148

原创 Ionic跳转去掉底部菜单（去掉二级页面的tabs），修改返回按钮

1.去掉二级页面的tabs菜单,找到app.module.ts*IonicModule.forRoot(MyApp, { tabsHideOnSubPages: 'true', //隐藏全部子页面tabs backButtonText: '返回' /*配置返回按钮*/ })...

2018-10-24 09:46:37 331

原创 ionic基础知识

1.Ionic介绍ionic是一款基于Angualr，Cordova的强大的HTML5移动应用框架，可以快速创建一个跨平台的移动应用。可以快速开发移动App,移动端WEB页面，微信公众平台应用，混合App，WEB页面2.Ionic和Cordova，Angualr关系Ionic = Cordova + Angualr +Ionic cssIonic是完全基于谷歌的Angular框架，在Ang...

2018-10-23 14:41:39 169

qq_37201926的博客