离子4乐蒂动画问题

时间:2019-06-23 11:12:17

标签: ionic4

我只是在app.component.ts中使用它安装了lottie插件,以显示屏幕,但显示错误

TypeError: this.lottieSplashScreen.show(...).then is not a function

任何人都可以告诉这个问题,我需要像启动屏幕一样显示它,谢谢。

app.component.ts

import { Component } from '@angular/core';    
import { Platform } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { LottieSplashScreen } from '@ionic-native/lottie-splash-screen/ngx';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html'
})
export class AppComponent {
  public appPages = [
    {
      title: 'Home',
      url: '/home',
      icon: 'home'
    },
    {
      title: 'List',
      url: '/list',
      icon: 'list'
    }
  ];

  constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    private lottieSplashScreen: LottieSplashScreen
  ) {

    this.initializeApp();

  this.lottieSplashScreen.show('https://assets10.lottiefiles.com/packages/lf20_CLhLRL/data.json', false, 1024, 768)
  .then((res: any) => console.log(res))
  .catch((error: any) => console.error(error));
  }

  initializeApp() {
    this.platform.ready().then(() => {
      this.statusBar.styleDefault();

    });
  }
}

1 个答案:

答案 0 :(得分:0)

ionic native应该总是在设备就绪的状态:

import { LottieSplashScreen } from '@ionic-native/lottie-splash-screen/ngx';
import { Platform } from '@ionic/angular';

class ...
constructor(public plt: Platform, private lottieSplashScreen: LottieSplashScreen){
plt.ready().then(()=>{
   this.lottieSplashScreen.show('https://assets10.lottiefiles.com/packages/lf20_CLhLRL/data.json', false, 1024, 768)
  .then((res: any) => console.log(res))
  .catch((error: any) => console.error(error));
  }
});
}