Content

来源：互联网发布：羽毛笔哈利波特淘宝编辑：程序博客网时间：2024/05/21 17:41

一、ion-conteng

conteng组件提供了一个非常易于使用的content区域，并且有许多有效的方法来控制滚动的区域。

content区域也可以通过使用刷新控件来实现下拉刷新

<ion-content>  Add your content here!</ion-content>

二、可以使用Angular的@viewChild注解来获得页面中content的引用

import { Component, ViewChild } from '@angular/core';import { Content } from 'ionic-angular';@Component({...})export class MyPage{  @ViewChild(Content) content: Content;  scrollToTop() {    this.content.scrollToTop();  }}

三、实例成员

1、contentTop

代表conteng的顶部有多少个像素被调整，可以用padding和margin

2、contentBottom

同上

3、scrollTo(x,y,duration)

时间默认为300ms，会在滚动完成之后返回一个promise

4、scrolltoTop(duration)

5、getScrollTop()

6、setScrollTop()

7、scrollToBottom(duration)

8、getContentDimensions()

返回包含content和scroll的元素的尺寸的对象

9、resize()

告诉content重新计算dimension，这应该在添加页眉、页脚或者tab之后调用。

四、输入属性

1、fullscreen：boolean，默认情况下，content是在headers和footers中，但是，使用fullscreen=true属性，content在headers和footers底下滑动，一开始使用fullscreen属性可能会察觉不到他们之间的差别，但是通过添加一个透明的header，之后就会发现content在header底下滑动。

0 0