Question

我正在尝试使用this安装媒体播放器插件，但是在尝试编译并启动它时会返回以下错误（ionic serve -l）。

  src / app / home / home.page.ts（14,1）中的
[ng]错误：错误TS1068：   意外的标记。构造函数，方法，访问器或属性为   预期的。

[ng] src / app / home / home.page.ts（23,1）：错误TS1128：需要声明或声明。

我所做的工作与文档中的完全一样，但错误仍然在这里。

home.page.ts：

import { Component } from '@angular/core';
import { StreamingMedia, StreamingVideoOptions } from '@ionic-native/streaming-media';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

constructor(private streamingMedia: StreamingMedia) { }


let options: StreamingMedia = {
  successCallback: () => { console.log('Video played') },
  errorCallback: (e) => { console.log('Error streaming') },
  orientation: 'landscape',
  shouldAutoClose: true,
  controls: false
};
}

app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { StreamingMedia, StreamingVideoOptions } from '@ionic-native/streaming-media';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  providers: [
    StatusBar,
    SplashScreen,
    StreamingMedia,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

我忘记了开始使用此插件的东西吗？

Answer 1

离子4更改了一些对象。您需要为视频定义此对象（StreamingVideoOptions）。例如；

 myStreamVideoOptions :StreamingVideoOptions = {
successCallback: function() {
  console.log("Video was closed without error.");
},
errorCallback: function(errMsg) {
  console.log("Error! " + errMsg);
},
orientation: 'landscape',
shouldAutoClose: true,  // true(default)/false
controls: true // true(default)/false. Used to hide controls on fullscreen

};

然后您可以使用它

let media: StreamingMedia = new StreamingMedia()
media.playVideo('my_video_url',this.myStreamVideoOptions)

因此，您示例中的完整代码；

import { Component } from '@angular/core';
import { StreamingMedia, StreamingVideoOptions } from '@ionic-native/streaming-media';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  myStreamVideoOptions: StreamingVideoOptions = {
    successCallback: function () {
      console.log("Video was closed without error.");
    },
    errorCallback: function (errMsg) {
      console.log("Error! " + errMsg);
    },
    orientation: 'landscape',
    shouldAutoClose: true,  // true(default)/false
    controls: true // true(default)/false. Used to hide controls on fullscreen
  };

  constructor(private streamingMedia: StreamingMedia) {

  }

  play(){
    let media: StreamingMedia = new StreamingMedia()
    media.playVideo('my_video_url',this.myStreamVideoOptions);
  }
}

让我知道它是否对您有用

对不起，我的英语不好！

在ionic 4

1 个答案: