ionic2 问题记录

最新推荐文章于 2020-09-18 14:23:03 发布

原创最新推荐文章于 2020-09-18 14:23:03 发布 · 3.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ionic2 #angular2

ionic 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了Ionic框架下的一些实用技巧，包括如何在页面跳转时隐藏标签栏、自定义返回按钮的文字、配置跨域访问、在页面返回时传递参数、设置按钮禁用状态、自定义幻灯片指示器样式、解决常见错误等。

1. 如何在push页面后隐藏tabbar

在ionicBootstrap中设置tabsHideOnSubPages为true

2. 如何设置返回按键文字

在ionicBootstrap中设置backButtonText，如"返回"或""

3. 如何设置跨域访问

在config.xml中<allow-navigation href="http://*/*"/>

4. 如何在page pop后传递参数到前一个页面

a) 使用model来代替push，然后在dismiss方法中传递参数

b) 使用Promise

parent:

new Promise((resolve, reject) => {
  this.nav.push(ChildPage, {resolve: resolve});
}).then(data => {
  let value = data["property"];
});

child:

let resolve = this.navParams.get("resolve");
resolve({property: value});

5. 如何设置button的disabled状态

<button disabled=“{{buttonDisabled}}”>
this.buttonDisabled = true;
this.buttonDisabled = null;

注意解除disabled状态需要设置绑定变量为null

6. 如何修改slides的bullet

在slides的option中添加下面两个属性：

bulletClass: "my-swiper-pagination-bullet",
bulletActiveClass: 'my-swiper-pagination-bullet-active'

7. duplicate symbol _kCDVFilesystemURLPrefix

xcode -> Build Settings -> no common blocks -> no

8. iframe使用src出现xss错误

  iframeUrl: SafeResourceUrl;
  constructor(public navParams: NavParams, public sanitizer: DomSanitizationService) {
    let url = navParams.get('url');
    this.iframeUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }

9. android splash screen 无法显示或显示白屏(2016.12.01)

  <preference name="SplashScreenDelay" value="2000"/>
  <preference name="FadeSplashScreenDuration" value="2000"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="ShowSplashScreenSpinner" value="false"/>
  <preference name="AutoHideSplashScreen" value="false" />
  <preference name="SplashShowOnlyFirstTime" value="false"/>

10. ion-slides使用autoplay属性报错cannot find property "hasAttribute"(2017.3.21)

解决：需要在ion-slides中添加*ngIf判断ion-slide项是否为空，如*ngIf="slides.length > 0"