/* ---html----*/

<ion-content>

  <button (click)="manual()">手动关闭</button>
<button (click)="automatic()">自动关闭</button> </ion-content> /* ---html----*/
/* ---js----*/

import { Page , Loading , NavController } from 'ionic-angular';

@Page({
templateUrl: 'build/pages/tabs/tabs.html',
}) export class TabsPage { static get parameters() {
return [[NavController]];
} constructor(nav) {
this.nav = nav;
} manual() {
let loading = Loading.create({
content: "Please wait...",
spinner: 'ios-small',
});
this.nav.present(loading);
setTimeout(() => {
loading.dismiss();
console.log('我没有设置duration属性。我是手动关闭的。')
},1000)
} automatic(){
let loading = Loading.create({
content: "Please wait...",
spinner: 'ios-small',
duration:1000
});
this.nav.present(loading);
loading.onDismiss(()=>{
console.log('我是自动关闭的。')
});
} } // loading设置参数
// 1、content:内容,可以是html语句
// 2、duration:持续时间 ,当时间走完的时候 去走dismiss()方法。也就是Loading.create的标识符中的方法
// 3、showBackdrop:是否显示背景层
// 4、spinner:loading图标的可选svg ios、dots、bubbles、circles、ios-small、crescent hide,hide则是不显示图标
// 5、cssClass:自定义风格
// 6、dismissOnPageChange:是否在导航到新的页面时忽略该指标 默认:不忽略,这个方法就是说 本view跳转到别的view时 此loading还生效不生效
// !注意手动关闭和自动关闭的方法名不一样的。 /* ---js----*/

4、加载:Loading的更多相关文章

  1. jQuery8种不同的瀑布流懒加载loading效果

    优化图片加载插件jQuery8种不同的瀑布流懒加载loading效果  在线预览 下载地址 实例代码 <ul class="grid effect-1" id="g ...

  2. 一个很酷的加载loading效果--IT蓝豹

    一个很酷的加载loading效果,自定义LeafLoadingView实现,LeafLoadingView继承view, 本例子主要由以下几点构成 (1):RotateAnimation实现叶子旋转 ...

  3. 纯css3 加载loading动画特效

    最近项目中要实现当页面还没有加载完给用户提示正在加载的loading,本来是想做个图片提示的,但是图片如果放大电脑的分辨率就会感觉到很虚,体验效果很不好.于是就采用css3+js实现这个loading ...

  4. 简易仿ios菊花加载loading图

    原文链接:https://mp.weixin.qq.com/s/wBbQgOfr59wntNK9ZJ5iRw 项目中经常会用到加载数据的loading显示图,除了设计根据app自身设计的动画loadi ...

  5. php+ajax实现登录按钮加载loading效果

    php+ajax实现登录按钮加载loading效果,一个提高用户体验,二个避免重复提交表单,ajax判断加载是否完成. 登录表单 <form onsubmit="return chec ...

  6. react 首页加载loading

    首页加载loading,放在#root里面,代码如下: <!DOCTYPE html> <html lang="en"> <head> < ...

  7. React Native封装Toast与加载Loading组件

    React Native开发封装Toast与加载Loading组件 在App开发中,我们避免不了使用的两个组件,一个Toast,一个网络加载Loading,在RN开发中,也是一样,React Nati ...

  8. vue axios配置 发起请求加载loading请求结束关闭loading

    axios带有请求拦截器,避免在每个请求里面加loading重复操作,可以封装进去,在请求开始时加载loading层,请求结束关闭,loading层用vux的loading加载 axios.js im ...

  9. 谈谈加载(Loading)的那点事

    谈谈加载(Loading)的那点事 2013/10/12 | 分类: 设计 | 0 条评论 | 标签: 交互设计, 加载 分享到:33 原文出处: 搜狐焦点 对于加载(loading),想必大家都不陌 ...

  10. 基于jQuery的图片加载loading效果插件

    基于jQuery的图片加载loading效果插件 图片loading的效果是网页中比较常见的,尤其是对大图片,loading效果让用户能够明白图片加载的过程. 实现思路也是比较简单的: $.fn.Lo ...

随机推荐

  1. WPF 动态更换模板

    Window x:Class="模板选择器.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml ...

  2. yum及RPM安装

    yum及RPM安装 基本说明: 1.yum相当于windows上面的360软件中心 2.yum是redhat系列发行版的软件安装命令 debian系统用的是apt-get 3.yum安装软件的来源得存 ...

  3. MongoSQL 复制数据表报错

    报错内容为: [thread1] SyntaxError: identifier starts immediately after numeric literal @(shell):1:2 解决方案: ...

  4. bit、Byte、bps、Bps、pps、Gbps的单位的说明及换算

    一.bit与Byte区别 1. bit(比特) 是电脑记忆体的最小单元,在二进制计算机中,每一比特代表0或1的数位信号. 2. Byte(单位字节) 一般表示存储介质大小的单位,数字.字母和特殊符号占 ...

  5. Win通过端口号结束进程

    准备: 01在cmd中查看命令使用 格式:命令名称 /? 02netstat 03findstr C:\Users\Good>findstr /? 在文件中寻找字符串. ...... strin ...

  6. Android蓝牙连接自动测试工具

    蓝牙连接自动测试工具 1.需求产生 开发不按着需求走都是耍流氓且浪费时间.此工具的需求产生是研发人员在开发产品时涉及到蓝牙驱动和安卓蓝牙两个东西.但是呢,蓝牙不太稳定,那么工作来了.就需要研发人员一边 ...

  7. 用python脚本 从xls文件中读取数据

    导入 xlrd 第三方模块 import xlrd data = xlrd.open_workbook('test.xlsx') # 打开xls文件 table = data.sheets()[0] ...

  8. 制作一句话图片马(NO)

  9. 非阻塞模式ServerSocketChannel 聊天室服务器端

    import java.io.IOException; import java.net.InetSocketAddress; import java.nio.ByteBuffer; import ja ...

  10. bzoj1076 奖励关 期望dp

    题目传送门 题目大意:总共有k次弹出宝物的机会,宝物共有n种,弹出不同的宝物的概率相同的,是每个宝物都有价值,和选择这个宝物的限制(必须具有特定的宝物),问最后的最优期望是多少. 思路:“正向推概率, ...